Hi I need some help with my footer on my website.
At the bottom you can see I have 2 footer sections. They both are functional however the one on the right is out of proportion to the middle one. I would like them to be the same proportion.
The right one is using a plugin called SK Latest Posts Widget, It pulls posts from a forum onto a sidebar/footer for wordpress. I cannot find what I have to change.
Here is my footer code.
</div>
<div id="front-popular" class="clearfloat">
<div id="recentpost" class="clearfloat">
<?php /* Widgetized sidebar, if you have the plugin installed. */ if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar(5) ) : ?>
<?php endif; ?></div>
<div id="mostcommented" class="clearfloat">
<h3>Most Commented</h3>
<ul><?php $result = $wpdb->get_results("SELECT comment_count,ID,post_title FROM $wpdb->posts ORDER BY comment_count DESC LIMIT 0 , 5"); foreach ($result as $topfive) { $postid = $topfive->ID; $title = $topfive->post_title; $commentcount = $topfive->comment_count; if ($commentcount != 0) { ?> <li><a href="<?php echo get_permalink($postid); ?>" title="<?php echo $title ?>"><?php echo $title ?></a></li> <?php } } ?>
</ul>
<?php /* Widgetized sidebar, if you have the plugin installed. */ if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar(6) ) : ?>
<?php endif; ?>
</div>
<div id="recent_comments" class="clearfloat">
<?php if (function_exists('get_most_viewed')): ?>
<h3>Most Viewed</h3>
<ul>
<?php get_most_viewed('post',5); ?>
</ul>
<?php endif; ?>
<?php /* Widgetized sidebar, if you have the plugin installed. */ if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar(7) ) : ?>
<?php endif; ?>
</div>
</div>
<div id="footer"> <?php wp_footer(); ?> Powered by <a href="http://wordpress.org/">WordPress</a> | <?php if ( is_user_logged_in() ) { ?> <?php wp_register('', ''); ?> | <?php } ?> <?php wp_loginout(); ?> | <a href="<?php bloginfo('rss2_url'); ?>">Entries (RSS)</a> | <a href="<?php bloginfo('comments_rss2_url'); ?>">Comments (RSS)</a>
<!-- <?php echo get_num_queries(); ?> queries. <?php timer_stop(1); ?> seconds. -->
</div>
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-10554255-1");
pageTracker._trackPageview();
} catch(err) {}</script>
</body>
</html>
Here is my CSS for my footer.
/* Footer*/
#front-popular {
font-size:0.7em;
color:#fff;
width: 940px;
background:#2c2c2c url(images/bottombar.png) bottom no-repeat;
margin: 0 auto;
padding:10px;
}
#recentpost, #mostcommented {
width:280px;
float:left;
padding:10px;
border:1px solid #fff;
}
#mostcommented {
margin-left:17px;
}
#recent_comments {
width:280px;
float:right;
padding:10px;
border:1px solid #fff;
}
#recentpost a, #mostcommented a, #recent_comments a {
color:#fff;
}
#recentpost ul, #mostcommented ul, #recent_comments ul {
margin-top:5px;
}
#recentpost ul li, #mostcommented ul li, #recent_comments ul li {
list-style:none;
border-top:1px dotted #fff;
padding:5px;
display:block;
}
#recentpost ul li:hover, #mostcommented ul li:hover, #recent_comments ul li:hover {
background:#3c78a7;
color:#fff;
}
#recentpost ul li:first-child, #mostcommented ul li:first-child, #recent_comments ul li:first-child {
border-top:0px dotted #fff;
}
#footer {
margin: 0 auto;
width: 960px;
font-size:0.6em;
padding-top:10px;
padding-bottom:10px;
}
If anyone can help it would be very much appreciated.