SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Zealot
    Join Date
    Dec 2007
    Posts
    95
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    IE6 Destroys my site

    Hello all,

    We just had a customer call because he was using IE6, and we found that it destroys the layout of the site.

    Just wondering if anyone has any idea what the problem is...

    Crawfish, Crawfish Boil Pots, & Propane Burners | Crawfish.com

    It's a new design, and we didn't consider IE6 in production. Ouch
    Independent Web Designer/Developer in Mandeville, LA USA
    1. JoeyReed.com
    2. Crawfish.com
    3. Pralines.com

  2. #2
    SitePoint Wizard rguy84's Avatar
    Join Date
    Sep 2005
    Location
    Durham, NC
    Posts
    1,659
    Mentioned
    5 Post(s)
    Tagged
    0 Thread(s)
    Not knowing your location, do youu find a lot of people still visit on ie6? If no, I would just tell them how a more modern browser is needed.
    Ryan B | My Blog | Twitter

  3. #3
    SitePoint Zealot
    Join Date
    Dec 2007
    Posts
    95
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well I looked at our stats and 5% of our traffic is coming from IE6, so unfortunately we'll have to account for it.
    Independent Web Designer/Developer in Mandeville, LA USA
    1. JoeyReed.com
    2. Crawfish.com
    3. Pralines.com

  4. #4
    Non-Member
    Join Date
    Jun 2010
    Location
    4727′35″N 2618′0″E
    Posts
    1,789
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try and get rid of those pesky comments between divs and everywhere. It seems that they break the header element for you in IE6.

  5. #5
    SitePoint Member
    Join Date
    Sep 2006
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Running the code quickly through DreamweaverCS5, there are multiple spots where IE6/7 will have problems.

    line 154 and 163: Positioned containers define a new stacking order, even when the computed z-index of the container is auto. This can cause positioned children of the container to appear above other positioned elements on the page when they should not.

    176 possible: If line-height is defined for a block, it will collapse by half for any line that contains an inline replaced element (img, input, textarea, select, or object).

    Numerous:
    If a link with display: block and no explicit dimensions is inside a list item, any spaces or linebreaks that follow the list item in the code will cause extra whitespace to appear in the browser.

    Affects: Internet Explorer 6.0
    Likelihood: Very Likely

    line 480:
    Any content that does not fit in a fixed-width or -height box causes the box to expand to fit the content rather than letting the content overflow.

    Affects: Internet Explorer 6.0
    Likelihood: Likely

    Not to mention you're pulling a lot of javascript. I use Jquery fairly extensively and we have to test for IE6. It usually works and only has issues when setting CSS properties or manipulating elements with specific paddings/margins so that framework (which is all javascript) is fine but possibly, if in your other .js files you are using anything to position or move elements, you may have some issues.

    Initially though, it looks to be all css-related and things like removing comments where possible as mentioned above.

    Could download IETester for free on a Windows machine and see from IE5 through 9. Also, if on a Mac IE5.5 is pretty close to what IE6 on Windows renders. If, by any chance you're on Citrux, they use IE6 for the browser.

  6. #6
    SitePoint Wizard
    Join Date
    Oct 2005
    Posts
    1,850
    Mentioned
    5 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by socalcane View Post
    Well I looked at our stats and 5% of our traffic is coming from IE6, so unfortunately we'll have to account for it.
    Or you could just tell people to upgrade.

    Otherwise, have fun redesigning your site to support a 10-year-old, obsolete, buggy, insecure browser that fewer people are using every day. Your voice may get a little hoarse from all the swearing you are going to do.

  7. #7
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,526
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    There are two main problems with your page and IE6 and the first is the double margin bug on floats is pushing everything over the place.

    Add display:inline to every floated element that has a side margin and it will cure it (It is only a bug on floats whose side edge touch the containing block but on a page with that may floats you may as well add it to all floats that have a side margin to make sure).

    The other main problem is that the png fix method you are using doesn;t seem to cater fo repeats or positioning.

    Code:
    <script type="text/javascript" src="http://www.crawfish.com/minify/1272514090/js/lib/ds-sleight.js,/skin/frontend/base/default/js/ie6.js" ></script>
    Removing that code and the page snaps back into position albeit with many minor bugs. Try another png fix instead such as the twinhelix pngfix. Or just use normal non transparent images for IE6.


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
  •