Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • September 2, 2014 at 2:53 am #312025
    djshortkut

    I am having an issue with my portfolio grid and also want some help with some modifications

    1. The grid doesn’t seem to stretch fullwidth. There is some white space on the right side of the screen that shows up on all devices except my iPhone. Can you give me some Quick CSS to make the portfolio grid fullwidth on all screen sizes?

    2. I would like to center the titles underneath each portfolio section and change the color of the background to black and make the text white.

    Thanks in advance!

    September 3, 2014 at 3:43 am #312602
    Devin

    Hi djshortkut!

    1) This is white space the browser adds in and we are not able to edit it.

    2) Try adding the following CSS to your Quick CSS (located under the Styling Tab in the theme options) or the custom.css file in the css folder of your theme files:

    
h3.grid-entry-title.entry-title {
    text-align: center;
    color: #fff !important;
    background: #000;
}
.grid-entry.isotope-item .grid-content {
    background: #000;
}

    Regards,
    Devin

    September 3, 2014 at 6:56 pm #313068
    djshortkut

    Thanks Devin!

    1. So here’s the thing with the portfolio grid. If I select 4 columns, it goes full width on all screen sizes but if I select 3 columns it has that 1 pixel gap on the right side of the screen. Is there any way to stretch everything over just a little bit to compensate for this? Not sure why it would work correctly with 4 columns but not 3. Unfortunately I want to use 3 columns on my site. Ismael helped me with a similar issue with the masonry grid before. I figure it can be fixed the same way across all devices.

    https://kriesi.at/support/topic/enfold-bugsissues/

    2. The other issue I noticed is that since I centered the title underneath the portfolio items, if the title is too long and moves to a second line, the titles that aren’t 2 lines have a thin border line 3/4 of the way down. Can you tell me how I can remove this please?

    https://www.dropbox.com/s/guu80c46ofilx59/Screen%20Shot%202014-09-03%20at%209.50.50%20AM.png?dl=0

    September 8, 2014 at 3:02 pm #315093
    Devin

    1) I only see the browser based gap which has no “fix”.

    2) That is the border to the actual portfolio item and not the title. Since its a box shadow it can’t be removed on just the bottom but it could be removed completely:

    
.page-id-8085 .grid-entry .inner-entry {
margin-right: 1px;
box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
position: relative;
}
    October 6, 2014 at 4:07 am #330681
    djshortkut

    Ok I figured it out. Thanks!

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘Portfolio Grid Issues’ is closed to new replies.