Modern Portfolio Alignment & Category Archive Link

Community Forums Forums General Discussion Modern Portfolio Alignment & Category Archive Link

This topic is: resolved

This topic contains 4 replies, has 2 voices, and was last updated by  ljkeller 1 year ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #61247

    ljkeller
    Participant
    Post count: 4

    I’m using the Genesis Featured Port widget for my Portfolio. I have it set to display 9 posts, and to show the category archive link on the bottom.

    Currently, the 9 images will not align properly. If I set it to six, they are fine. But as soon as I go to 7 or higher, they are messed up.

    Also, the link to view more from my portfolio shows up between the 2nd and 3rd post rather than on the bottom.

    http://www.lizakeller.com

    A little help would be much appreciated!

    • This topic was modified 1 year ago by  ljkeller.
    • This topic was modified 1 year ago by  ljkeller.
    #61256

    Robin
    Participant
    Post count: 318

    The posts themselves are fine, but the widget is built assuming that all the images, headlines, and content limits will be exactly the same height and number of lines, and when they’re not, funky things will happen with the layout.

    So, your sixth post’s headline stretches to two lines, which makes it taller than #4 and #5, which messes up the third line altogether. But your seventh post also causes an issue because the image is shorter than the rest.

    You can alleviate it by a bit of a hack if you add something like this to your CSS:

    .featuredpost .category-portfolio {
    height: 300px;
    }

    This would force all of the posts to be the same height no matter what their content is. I don’t know if 300 is the magic number (in Chrome’s inspector, it’s working for me) and not sure how it will affect the responsiveness, but it’s one way to tackle it. HTH


    I do the best I can with what I’ve got. (say hey on twitter)

    #61269

    ljkeller
    Participant
    Post count: 4

    Thank you so much! That solved the issue of the alignment.

    Any idea how to force the category link below the featured posts?

    #61352

    Robin
    Participant
    Post count: 318

    It’s probably part of the same issue, but you can make sure it will always go below by adding a clear property to the selector:

    .more-from-category {
        clear: both;
    }

    I do the best I can with what I’ve got. (say hey on twitter)

    #61369

    ljkeller
    Participant
    Post count: 4

    Perfect! Thank you so much!

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.