Grow your CSS skills. Land your dream job.

CSS Layout problems in IE6

  • # September 15, 2009 at 5:00 pm

    Hello,

    I’ve just created my first CSS website in Dreamweaver. I’m having some problems with my layout in IE6, that doesn’t occur in IE7, 8, or safari, etc. I think it might have something to do with my margins. Seems a certain div is getting pushed down creating a giant empty space in my layout. Every time I try to fix it, it messes up with the other browsers. Any help would be greatly appreciated.

    Example Page Link:http://www.jeunique.com/newsite/EN/pages/skincare/cleansers_1.html

    Here is a link to the complete CSS code: http://www.jeunique.com/newsite/CSS/main.css

    I believe within this particular CSS portion is the problem:

    Code:
    }
    .twoColFixLtHdr #sidebar1 {
    float: left;
    width: 115px;
    height: 500px;
    padding-top: 31px;
    padding-left: 15px;
    margin-top: auto;
    margin-bottom: auto;
    }
    .twoColFixLtHdr #mainContent {
    padding-left: 5px;
    margin-top: 20px;
    padding-top: 0px;
    margin-left: 155px;
    padding-right: 5px;
    }
    # September 16, 2009 at 5:30 pm

    I don’t think IE6 supports auto margins.

    # September 16, 2009 at 8:34 pm

    Can you post an image of what it looks like in IE6? I don’t have an IE6 I could look at.

    If you are able to fix it in IE6, just use a conditional statement to add another style sheet if the user has IE6. Make sure you put !important in each of the CSS rules:

    Example:
    body {font-size:12px !important;}

    IE6 conditional statement that you put in your head section:
    <!–[if IE 6]>
    <link rel="stylesheet" href="ie6.css" type="text/css" />
    <![endif]–>

    Where ie6.css is a CSS file you create that has the code that fixes the problem in IE6. If the user doesn’t have IE6, that file won’t be called and they will view the website as it displays without ie6.css.

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".