Question

I’m having a tough time formatting this WordPress widget to look good.

http://healthybodyguru.com/
It’s the “Hottest Posts this Month” widget near the bottom.

I’ve got the 1st line of text vertical-aligned to the top, but the additional lines appear underneath the image.

Here’s some CSS I’ve been playing around with:

#featured-bottom .popular-posts li {
    list-style-type: none;
    padding-left: 0px;
    margin: 0 0 10px 0;
    position: relative;
    float: left;    
}
.popular-posts img {    
    margin-right: 10px;
    vertical-align: top;
}
.popular-posts .wpp-post-title {
    font-size: 14px;
}

Any ideas? I’ve read through similar questions but the answers didn’t seem to help my particular case.

Answer 1

You want:

.popular-posts img {    
    margin-right: 10px;
    float: left;
}