Support » Themes and Templates » Need to make footer same width as main content area

  • Resolved SILVERSKIN


    Hi guys,

    I’m setting up a new site at and am having troubles that I hope you can help me with. I had a developer make the basic site functionality but have been left alone with the look and feel side of things, and am having troubles.

    I am trying to make the footer the same width as the main body however it is currently set up to go to the edges of the screen no matter how far you zoom out. I’ve looked in the sytlesheet however the code that is in other posts to change ( .footer ) is nowhere to be seen.

    Is anyone able to spare a couple of minutes to have a look into this for me and let me know if there’s something simple I might be able to add to get it to sit flush with the main text?

    Many many thanks in advance,

Viewing 5 replies - 1 through 5 (of 5 total)
  • I’m not sure if you need the whole stylesheet or if the footer.php is what you’re after, below is the footer.php, thanks again!

    <div id="footwrap">
    	<div id="foot">
    		<div class="footbox">
    		<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Footer Left') ) : ?>
    		<?php endif;?>
    		<div class="footbox">
    		<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Footer Center') ) : ?>
    		<?php endif;?>
    		<div class="right" style="float:left; margin: 18px 0 0 0; padding: 0 0 0 20px; width:220px; font-size: .8em;">
    		<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Footer Right') ) : ?>
    		<?php endif; ?>
    		<div class="clear"></div>
    		<div class="paragraph"><?php wp_footer();?></div>

    [Moderator Note: Please post code or markup snippets between backticks or use the code button. As it stands, your code may now have been permanently damaged/corrupted by the forum’s parser.]

    Try using Firefox with the Firebug add-on for this kind of CSS work.

    Hi there esmi,

    I’ve seen that but it doesn’t help – I can’t find any footer width in the code I can adjust.

    I understand it’s a basic question, and I’ve tried for hours to figure it out for myself however I can’t get it – any chance you or someone can help me know what I need to add?




    Forum Moderator

    Did you try using Firebug? It’s indispensable for working with CSS — and if you are trying to make changes to the site yourself, you will need to learn basic CSS. That said, the CSS you need to modify uses the selector #footwrap — and you can change the width by making these changes:

    #footwrap {
        background: url("images/footbg.gif") repeat-x scroll left top #231F20;
        border-bottom: 4px solid #312D2D;
        clear: both;
        margin-left: auto;
        margin-right: auto;
        margin-top: 18px;
        position: relative;
        width: 970px;

    Note that you may have problems with it on other pages — if they are not all the same width. In that case, you’d probably need to modify the overall structure and put the footer inside the page wrapper…

    WPyogi, thank you thank you thank you. Honestly, thank you very much!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Need to make footer same width as main content area’ is closed to new replies.