Support » Themes and Templates » Align Preview Images to Left of Excerpt and Title

Viewing 4 replies - 1 through 4 (of 4 total)
  • Moderator bcworkz


    This may not be the right solution overall, but it looks OK on the page you linked.

    .entry-thumbnail {
        left: 20%;
        position: absolute;
        width: 15%;

    I actually added this to the rules starting on line 1439 of style.css, of which entry-thumbnail is one of many classes listed. In my browser’s local copy of course. This makes the article blocks too far apart though. You have some absolute positioning in each article tag that needs to be revised to fix that aspect.

    The support topic you linked was advocating adding align="left" to the <img> tag, but that is a depreciated attribute now, and it would not work in your case because the thumbnail container is the problem, not the image itself. The image is doing what it’s supposed to do within the constraints of it’s container.

    Thank you so much, bcworkz, this works great. I tried removing position:absolute from the tags but that makes the articles overlap each other. Any idea how I could go about solving that?

    Moderator bcworkz


    I see you figured out you needed to remove the pixel spacing parameters as well. I should have been more explicit, sorry for an confusion. Glad it’s sorted. Cheers.

    If I change the top margin in the html for each entry I can reduce the spacing between them but I can’t figure out how to do it automatically using css.

    So here, I’d change 288px to, say, 266px, but the next entry has a different number of pixels, and so on for each.

    <article id="post-834" class="post-834 post type-post status-publish format-standard hentry category-uncategorized column onecol has-thumbnail masonry-brick" style="position: absolute; top: 288px; left: 0px;">

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Align Preview Images to Left of Excerpt and Title’ is closed to new replies.