Topic: css & IE 6

On my website i use a lot of css. But i there is a problem with IE6. The following code is for the left div, which contains the navigation and the phololog.

#navigation {

	background:url(../images/booty_menu_header.gif) #fff top left no-repeat;color:#666;

	margin:60px 0 0 36px;padding:50px 0 0 0;

	float:left;

	width:202px;  /* False value for IE4-5.x/Win */

	voice-family: "\"}\""; 

	voice-family:inherit;

	width:152px; /* Actual value for conformant browsers */

}

html>#navigation {

	width:152px; /* Be nice to Opera */

}

I want to have "margin:60px 0 0 50px" but when i look at IE6 with these settings, the content div goes under the navigation. Everything looks fine in Mozilla, IE/mac and Safari, but IE6 seems the have some problems with that value. Any help?

Thanks.

u-neek: Why not add the alternative padding styles into the box model hack? IE/Win will cause you problems with things like this unless you allow for it in the hack.

___________________
Emps

FAQs: Emperor

You mean this way?

#navigation {

  background:url(../images/booty_menu_header.gif) #fff top left no-repeat;color:#666;

  margin:60px 0 0 36px;padding:50px 0 0 0;  /* false */

  float:left;

  width:202px;  /* False value for IE4-5.x/Win */

  voice-family: "\"}\""; 

  voice-family:inherit;

  margin:60px 0 0 50px; /* right value */

  width:152px; /* Actual value for conformant browsers */

}

html>#navigation {

  margin: 60px 0 0 50px;

  width:152px; /* Be nice to Opera */

}

That will/does not work, because that hack works only for IE4-5.5. Not 6.

u-neek: Ahhhhhhhhhhhhhhh good point - there are a range of box model hacks available so check them out - links here:
http://development.gurusnetwork.com/discussion/thread/2283/

___________________
Emps

The Emperor dot org

Ok, i've played around with my source but i cannot get one thing to work in IE:

#content {
margin:298px 0 25px 222px;
}

The content div is 222px from the right in every browser, 25px from the bottom, but not 298px from the top in IE6.
When i change it to margin-top:298px;margin:right:0;margin-bottom:25px;margin-left:222px; it won't work as well.

It works on every browser, but why not in IE 6.0????????

Thanks.

[This message has been edited by u-neek (edited 10-07-2003).]

I fixed it. I added to #main padding-top:298px and deleted the 298px in #content.

But i still don't know, why IE won't do this the other way around.