Results 1 to 3 of 3

Thread: White space between main and footer

  1. #1
    Join Date
    May 2008
    Posts
    7
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default White space between main and footer

    Hi

    I am having a problem with a white row appearing between my main content and footer in FF. Can anyone tell me how to get rid of this.

    HTML

    <div id="footer"><br />
    <p align="center" class="style7"> Copyright 2008
    <br />
    Graphic Design - Printing<br />
    <p>

    </div>

    CSS

    .oneColFixCtrHdr #footer {
    padding: 0;
    background-color: #A6BF7D;
    }

    ---The main content ends directly before the footer.----
    .oneColFixCtrHdr #mainContent {
    padding: 0 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
    background: #EBEEDF;
    background-image:url(images/mainpageborder.gif);
    font:Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;

    }

    Any help much appreciated - I am sure it is something very simple that I am missing. Nuts

  2. #2
    Join Date
    Jul 2006
    Location
    just north of Boston, MA
    Posts
    1,806
    Thanks
    13
    Thanked 72 Times in 72 Posts

    Default

    you either have missing padding or margin in the main content or the footer

    check the overall wrapper of the main portion, and check the last item in the main portion, sometimes people reset 1 but forget the other,
    then just apply

    Code:
    margin:0;
    to your footer, as I see you have reset the padding property already

  3. #3
    Join Date
    May 2008
    Posts
    7
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Hi - Thanks for that!

    Something wierd is definately going on - I added the margin 0 to both the main contect and the footer. It appeared correct in DW but not when I look through IE7 or FF. I also tried putting a border as DW said this would fix it - again right in DW but not through the browsers.

    I tried copying the css used for the header which is fine and this shows right on the screen and IE but not in FF - again the gap between the content and the footer!

    New code I used is:
    }
    .oneColFixCtrHdr #footer2 {

    padding: 0px 0px 0px 0px;
    margin: 0;
    background-color: #A6BF7D;

    }
    .oneColFixCtrHdr #footer2 h1 {
    margin: 0;
    padding: 0px 0;
    background-color: #A6BF7D;
    }

    This sits before the footer divs.

    .oneColFixCtrHdr #mainContent {
    padding: 0 20px;
    background: #EBEEDF;
    background-image:url(images/mainpageborder.gif);
    font:Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    margin:0;

    }

    Any other suggestions would be wonderful! Thank you :-)

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •