1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Help fixing these spaces in a CSS layout?

Discussion in 'Web Design' started by csc1990, Dec 12, 2011.

  1. csc1990

    csc1990 Registered Member

    Joined:
    Jun 29, 2010
    Messages:
    64
    Likes Received:
    11
    I am building this site for Touchstone Ranch and I can't seem to get rid of the spaces in between the header and footer, separating them from the content.

    trtc . us/1

    Help?
     
  2. vegas23

    vegas23 Regular Member

    Joined:
    May 12, 2011
    Messages:
    234
    Likes Received:
    69
    Location:
    .uk
    Which spaces do you mean?

    The header touches the menu and the footer touches the body for me in ie9

    But you did spell Touchstone wrongly in your page title
     
    • Thanks Thanks x 1
  3. seoguru13

    seoguru13 Senior Member

    Joined:
    Jan 9, 2011
    Messages:
    1,063
    Likes Received:
    691
    Occupation:
    Businessman - SEO Consultant & Writer
    Location:
    India
    Home Page:
    I see a lot of padding in the CSS of the pages. Try bringing the padding-top and margin-top to 0px in the CSS. Should help.
     
  4. csc1990

    csc1990 Registered Member

    Joined:
    Jun 29, 2010
    Messages:
    64
    Likes Received:
    11
    Thanks for informing me of my misspelling. I opened it in IE and it is all touching, but it's positioned to the left. I will definitely need it to work across all browsers. At least until IE kicks the bucket.

    Lol, where do you see this padding? I am doing all of my work on this page (which will be used as a template for all inner pages, basically) in Dreamweaver and I've used no padding, I don't believe.
     
  5. vegas23

    vegas23 Regular Member

    Joined:
    May 12, 2011
    Messages:
    234
    Likes Received:
    69
    Location:
    .uk
    I clicked one of your inner pages and that was centered in ie9, I just assumed that you were changing something when it loaded.
     
  6. seoguru13

    seoguru13 Senior Member

    Joined:
    Jan 9, 2011
    Messages:
    1,063
    Likes Received:
    691
    Occupation:
    Businessman - SEO Consultant & Writer
    Location:
    India
    Home Page:
    Check out the stylesheets. It's in the layout.css or style.css if I remember.
     
  7. csc1990

    csc1990 Registered Member

    Joined:
    Jun 29, 2010
    Messages:
    64
    Likes Received:
    11


    Hmm... The only part of the layout.css that affects this page template I am creating would be the #wrapper #footer and #wrapper #header and neither of them have any top or bottom padding/margin. There are other elements in the css that use top/bottom padding, but they are not included on this page.
     
  8. csc1990

    csc1990 Registered Member

    Joined:
    Jun 29, 2010
    Messages:
    64
    Likes Received:
    11
    I searched Google for a solution and it said that using Dreamweaver it could be the BOM. So I made sure that it was not including BOM and it changed nothing. =/
     
  9. p1mp_ju1ce

    p1mp_ju1ce Registered Member

    Joined:
    Mar 13, 2009
    Messages:
    92
    Likes Received:
    7
    the space is caused by your <p> tag.

    try to add this line on your css

    #content p {padding:0; margin:0}
     
  10. csc1990

    csc1990 Registered Member

    Joined:
    Jun 29, 2010
    Messages:
    64
    Likes Received:
    11
    I added that to my CSS and it didn't change anything.

    But I took the <p> tags off of my place-holder content and the spaces did go away. Are they going to be absolutely necessary to my SEO value to use the paragraph tags?
     
  11. csc1990

    csc1990 Registered Member

    Joined:
    Jun 29, 2010
    Messages:
    64
    Likes Received:
    11
    But now, I added a div inside of my content body, to add my content, and the spaces return.