Genesis – Featured Posts Widget

Community Forums Forums Design Tips and Tricks Genesis – Featured Posts Widget

This topic is: not resolved

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

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #58279

    leahmatzkedesign
    Participant
    Post count: 1

    Hello, I have been playing with this for a few hours and am officially stuck.

    I am using the “Genesis – Featured Posts” widget in my footer and would like the 3 posts to appear one on top of the other. However, nothing I do in the css seems to make it so there is a break between each post – instead the images float up into the one above instead of listing out in a nice, tidy “one after the other” format.

    Here is the link of the site being built: http://166.63.127.20/~maple/

    Just scroll to the bottom and you will see the issue.

    Thanks for looking!

    http://166.63.127.20/~maple/
    #58333

    Natalie
    Participant
    Post count: 11

    It’s the height of the images that seems to be the problem. You can set a ‘min-height’ on the containing ‘div’ to be a bit larger than the image size. For example,

    #featured-post-2 .post {
    min-height: 320px;
    }

    That sets the minimum height of the div to 320 which is 20px taller than your images.

    #58346

    leahmatzkedesign
    Participant
    Post count: 1

    Thank you so much Natalie, that worked like a charm!

    How do you know what div id to use in the css? Do you just inspect the page and copy it from there or is there a list somewhere?

    #58358

    Natalie
    Participant
    Post count: 11

    You’re welcome!

    I inspected the element with Chrome’s dev tools. There are a number of ways you could target them, but each widget instance seems to have it’s own id or class generated when you create it so I don’t think there’d be a master list to go by.

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

You must be logged in to reply to this topic.