Author Name Showing Above Author Image (Custom Bylines)

Hello there!

So I’m a total amateur when it comes to coding and CSS, but I wanted to add the Author name and Gravatar image to my multi-author blog’s bylines. Thanks to tutorials online and threads in this forum, I was successfully able to do so! Well, almost.

I added this code to my child theme’s contents.php file to add the author name and the gravatar image:

<div class="entry-meta">
		<div id="author_pic">
		<a href="<?php echo get_author_posts_url( get_the_author_meta( 'ID' ) ); ?>" rel="author">
		<?php echo get_avatar( get_the_author_meta('ID'), 60); ?></a>
		</div>
        <span class="author"><?php the_author_posts_link(); ?></span>
    		<?php sela_entry_meta(); ?>
		</div><!-- .entry-meta -->

And to style the gravatars, I added this code to my styles.css:

.avatar {      
background-color: #F5F5F5;      
border: 1px solid #DDDDDD;      
border-radius: 50% 50% 50% 50%;      
padding: 4px; 
} 
#author_pic {
float: right;
margin-right: 0px;
}

This seemed to work perfectly! Except: two of my authors’ bylines have their names positioned before, above, and to the left of their gravatar image =/ The other three authors on the site shows the bylines perfectly, with the gravatar image above the author name and both justified to the right. Could someone please help me in fixing the other two author bylines?

You can view the blog here: L&SP Blog

Much appreciated!