DIV Padding\Margin is different in netscape and IE6

liunx

Guest
Hello all

I am having problem with padding and margin widths. If I get it right in IE, the text will be too far up in Netscape, if I get it right in Netscape the text is too far down in IE.

here is the coding I am using:

.divtoprowwhitecol {
position: relative;
white-space: normal;
padding-top: 30px;
padding-left: 200px;
vertical-align: top;
text-align: left;
float: left;
clear: right;
width: 800px;
}

By the way it is only padding-top that I am having a problem with.

Does anyone have any suggestions?

thanks in advance all.Well, for starters, get rid of vertical-align, as it won't do anything. Your problem is most likely caused by IE's misinterpretation(to put it lightly) of the CSS box model. In IE, when there is padding applied to an element, it includes it in the width of the element, rather than expanding the element with the padding. You could use a hack, like the following one, or you could use margins on elements inside the element, rather than padiding. If you must use padding, set it up like this:.divtoprowwhitecol {
position: relative;
white-space: normal;
padding-top: 30px;
padding-left: 200px;
text-align: left;
float: left;
clear: right;
width: 600px !important;
width: 800px;
}
What the !important statement does is tell standards browsers to only listen to the value defined in the line which it is present in. Therefor, it will ignore the second width attribute. However, since IE doesn't recognize this, it will use the definition that appears last in the styles, which would be the second one.
-DanIt's only the padding-top, not padding-left.

Can we see the page? That's not really enough to go on. It may be due to the position:relative but I can't be certain.Originally posted by lavalamp
It's only the padding-top, not padding-left.
Huh? Last time I checked, it screwed up both...Originally posted by smercer
it is only padding-top that I am having a problem with.Ah, oops :( Should probably have payed more attention to the stuff after the code... :DThanks guys

it was the !important solution that fixed the problem. I had forgoten all about !important attribute

Thanks all.OK, now I am confused. :SOriginally posted by lavalamp
OK, now I am confused. :S
Ditto! !important isn't an attribute, but rather a hack. And it should only have affected it if you were using a fixed height.. unless you used !important on the padding-top...
 
Back
Top