SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Zealot tim@getdim's Avatar
    Join Date
    Jul 2012
    Location
    Detroit
    Posts
    162
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Thumbs down Footer areas in different positions in different browsers

    I am having the opposite problem than ive asked about in the past.

    I have this site. its a custom theme based on twenty ten.
    In the past i needed to make the footer full screen width (which i was able to do).

    Now i need to do one of two things:

    either make the header full screen width
    or
    reduce the footer to normal page width.

    I have attempted to do the latter as i could not figure out how to do the former.

    problem is, everything is all out of whack.
    Ive gotten the width down, but all the various footer elements (body2, prefooter, footer, and subfooter, as well as the content within body2) are all in different positions depending on which browser you view it from.

    I normally use chrome, but the client i'm building this for uses IE.

    in chrome the main elements are in position or nearly so, but in IE everything is halfway to the left.

    I'm so frustrated and lost i have no idea what to do.

    The ideal would be to make the footer elements full width again (which i can do easily enough) and make the header full width as well (which i cant figure out)

    but that doesnt solve the issue of the body2 content elements being out of whack (different positions in different browsers)


    please help.

    site is http://americanindustrialinc.com

    screenshots available here:
    (IE) http://mydomainsample.com/ai-ie.png
    (chrome) http://mydomainsample.com/ai-c.png

  2. #2
    SitePoint Zealot tim@getdim's Avatar
    Join Date
    Jul 2012
    Location
    Detroit
    Posts
    162
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    UPDATE: I have managed to get everything looking good in IE, but in chrome, FF, and safari everything is shifted to the right and does not match with the page body.

    I really need to fix this if someone is willing to help.

  3. #3
    SitePoint Zealot tim@getdim's Avatar
    Join Date
    Jul 2012
    Location
    Detroit
    Posts
    162
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    UPDATE:

    I have fixed the positioning of everything. I simply had to put the secondary wrapper, body2, and all related divs inside the primary wrapper div.
    eliminate my left margins, and everything sits neatly where it should.

    I would still like to know how to extend the header across the full screen width, if i do that and return the footer to full width (which i know how to do now), i can change the bg color to white and the entire site will look much better.

    If someone is willing to help with that, i would greatly appreciate it.

  4. #4
    SitePoint Guru
    Join Date
    Oct 2010
    Location
    Portland, Or
    Posts
    634
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    I want to ask if you set the width of your header div to 100% w/no margin or padding.
    & if it is inside or outside of a containing div that might have padding or margins.
    Or is that too obvious?

    looking at your site it looks like the header is in a table? which has a width.


Tags for this Thread

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
  •