WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Need to make footer same width as main content area (6 posts)

  1. SILVERSKIN
    Member
    Posted 1 year ago #

    Hi guys,

    I'm setting up a new site at http://www.silverskincoffee.com 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,
    Matthew

  2. SILVERSKIN
    Member
    Posted 1 year ago #

    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>
    
    		<div class="footbox">
    
    		<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Footer Center') ) : ?>
    		<?php endif;?>
    		</div>
    
    		<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>
    
    		<div class="clear"></div>
    		<div class="paragraph"><?php wp_footer();?></div>
    	</div>
    
    </div>
    </body>
    </html>

    [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.]

  3. esmi
    Theme Diva & Forum Moderator
    Posted 1 year ago #

    Try using Firefox with the Firebug add-on for this kind of CSS work.
    http://getfirebug.com/

  4. SILVERSKIN
    Member
    Posted 1 year ago #

    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?

    Cheers,
    Matthew

  5. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    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...

  6. SILVERSKIN
    Member
    Posted 1 year ago #

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

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.