Excerpt Problems

Question

Hopefully I’m understanding what you want correctly. I think you are going to need to wrap the content itself in a div called something like excerpt_content and make that an inline block that’s aligned to the top. Then you can use the has_post_thumbnail() as a conditional to assign it another class to limit the width so it appears next to the post thumbnail instead of under it. Not sure if this is the most elegant way to do it, but it works. Note that if you want this to work in IE7 you’ll have to use float instead.

So, the CSS:

.excerpt_content.with-thumbnail {
  display: inline-block;
  width: 416px;
  vertical-align: top;
}

You .sub-title class shouldn’t need any padding anymore. And your code would look more like this:

<?php get_header(); ?>

<div id="container">
<div id="main_index">
<div class="main_adjust">

<!-- Grab posts -->
<?php while (have_posts()) : the_post(); ?>

<!-- Begin excerpt wrap -->
<div class="excerpt_wrap">
<div class="excerpt_inside">
    <?php if ( has_post_thumbnail() ) { ?>     
    <a href="https://wordpress.stackexchange.com/questions/28108/<?php the_permalink() ?>">
    <?php the_post_thumbnail( 'thmb-index' ); ?>
    </a>
    <?php } ?>
    <div class="excerpt_content<?php if ( has_post_thumbnail() ) echo ' with-thumbnail'; ?>">
    <span class="index_title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></span>
    <span class="sub-title">By <?php the_author_posts_link( ); ?> <span class="sub-title-divider">|</span> <?php the_time('F j, Y'); ?> <span class="sub-title-divider">|</span> <a href="#commentlist"><?php comments_number( 'No comments', 'One comment', '% comments' ); ?></a></span>
    <?php the_excerpt(); ?>
    </div><!-- .excerpt_content -->

<!-- End excerpt wrap -->
</div>
</div>

<?php endwhile; ?>

<!-- Next/Previous entries -->
<div class="mp_archive">
<div id="more_posts">
<div class="oe"><?php next_posts_link('&laquo; Older') ?></div><div class="re"><?php previous_posts_link ('Newer &raquo;') ?></div>
</div>
</div>

</div>
</div>
<?php get_sidebar(); ?>
</div>
</div>
<?php get_footer(); ?>

Related Posts: