double padding?

ie seems to be adding double padding-top

[beaudeal]

I have absolutely no clue why IE is doing this, but it appears to be adding double padding-top. I have a div tag with text inside. The code looks like this:

css
*****************************
#content {
padding: 10px;
font-size: 12px;
background-color: #fff; }
*****************************

html
*****************************
<div id="content">text goes here</div>

when this gets displayed in IE there is 20px padding top. I tried to fix it via the double margin bug, but this is not the problem.

[collymellon]

The way I would go is:

css
*****************************
#content {
font-size: 12px;
background-color: #fff; }

.contenttext {
padding: 10px; }
*****************************

html
*****************************
<div id="content"><p class="contenttext">text goes here</p></div>

--------------------------------

When adding padding in IE onto a div it will increase the height \ width by the amount of padding you have added, when working with specific heights \ widths you can get round this by deducting the amount of padding from the size of the div.

But the above should work spot on.

[beaudeal]

thanks so much for getting back, but i tried this out and it didnt work -- it produced exactly the same result. the strangest part is that it is just the padding-top. any other suggestions?

[Ingolemo]

It seems to me that there must be more code involved than just the bit you've given. Could you tell us the context of that element (what are its parents, siblings, and children)?

[beaudeal]

i actually used the holly hack to fix it -- just added * html #content {height: 1px;}

although i've heard this is getting fixed in IE7. anyone know if thats true?

[penders]

When adding padding in IE onto a div it will increase the height \ width by the amount of padding you have added...

As it should do, in all standards compliant browsers (FF etc.), using a correct DOCTYPE.

But, like Ingolemo suggests, the code given in the first post is OK in itself - it renders correctly in FF, IE6 (with or without a DOCTYPE) - so the problem is possibly its interaction with other elements.