My rows are wonky! - posts

Question

I am building a theme template page that calls up all the child categories of a particular parent and displays them so that they look like this:
The only trouble is that when any row has less than 3 posts, it looks like this:
I need to display 1-3 posts and move on to the next category if there are either more OR less than 3 posts, and not have it look like crap.
$taxonomy = 'category'; // e.g. post_tag, category
$param_type = 'category__in'; // e.g. tag__in, category__in
$term_args=array(
'orderby' => 'name',
'order' => 'ASC',
'child_of' => 13
);
$terms = get_terms($taxonomy,$term_args);
if ($terms) {
foreach( $terms as $term ) {
$args=array(
"$param_type" => array($term->term_id),
'post_type' => 'candidate',
'post_status' => 'publish',
'showposts' => -1,
'caller_get_posts'=> 1
);
$my_query = null;
$my_query = new WP_Query($args);
if( $my_query->have_posts() ) {
echo '<div class="val-postcontent val-post"><h4 >' . $term->name. ' Candidates</h4></div> ';
while ($my_query->have_posts()) : $my_query->the_post();
get_template_part('content', 'overview');
endwhile;
echo '<div class="test"><a href="' . get_category_link( $term->term_id ) . '" title="' . sprintf( __( "View all posts in %s" ), $term->name ) . '" ' . '>Click here to view all ' . $term->name. ' Candidates</a></div>';
}
}
}

Answer 1

I too belive this is a CSS issue, so it probably belongs on StackExchange instead, but here it goes:
The easiest, quickest (and probably ugliest) fix is to add <div style="display:block; clear: both;"> before each <div class="val-postcontent val-post">.
A quick way to make this a little bit cleaner: move the display:block; clear: both; into a separate css class, for example .clearfix {...}.
edit: I was to quick on the trigger. The div should be added before the div