Jeff Whiting

I'm not sure where else to submit this bug so I'd thought I'd put it here. The following html snippet doesn't render correctly in either IE 6 or IE 7. I realize I can change it so it does render but it is still a rendering bug that could be fixed (where's bugzilla for IE ). I would be interested in hearing why this is happening.

Code Snippet

<html>

<head>
<style>

#SkinContent {
background-color: white;
}

#Questions {
padding: 1px;
}

.QuestionOuter{
border: 1px solid #999999;
}

</style>
</head>

<body>

<div id='SkinContent'>
<div id='Questions'>
<div class='QuestionOuter CS'>
<div class='QuestionText'>abc</div>
<a></a>
</div>
<a></a>
</div>
a
</div>

</body>
</html>





Re: Internet Explorer Web Development Rendering Bug in IE 6 and IE 7

JavaScriptVoid

The reason this is happening has to do with IE's inability to calculate the padding of "Questions" when its parent container has no width or height defined. This is primarily also because IE doesn't always understand that padding: 1px means padding-top: 1px. So it wants some width somewhere because padding: 1px to IE means top, left, right, and bottom in some cases.

The null anchor tags make IE look at "SkinContent" for the start of figuring out the deminsions for calculating the padding. It is supposed to keep going up the ancestory of parent tags until it reaches the body tag for calculations. The body tag by default has a 100 percent width. Since it cannot find any deminsions for calculation it won't render correctly. It will give it padding, but the child divs probably get sent to outerspace somewhere cause IE doesn't know what to do when the padding is low like 1px for left and right. What is a width based pixel of padding when there is nothing to base it on IE can't answer that! If you just take one of those null anchor tags away it will instead look at the body tag for calculating the padding for "Questions" content. Or if you make any of the anchor tags "non-null" it will look to the body tag. This gives a number for IE to begin its calculations for the padding. The bug is IE's inability to understand that it needs to look at the body tag if it cannot find any demininsions anywhere else. Or you can just make it simple for IE and give "Questions" 0px padding or define it for IE better by specifing padding-top: 1px.