1

Apr

Filed in CSS, Code |

Today I was adding full screen support to iBox, and I hit an IE6 bug. The bug is introduced because the BODY tag had either margin or padding values of more than 0. This is a number of problems we’ve had with calculating positions because of the BODY clauses containing these extra pixels.

The solution:

<style type="text/css">
/* Remove the default margin and padding. */
body { padding: 0; margin: 0; }

/* Put your padding/margin on the wrapper clause. */
</style>
<body>
	<div id="wrapper">
	</div>
</body>

The reasoning behind this, is that most JS objects which need to go outside of the page frame, are appending to BODY. When they’re appending they can position themselves wherever they need to be. However, if it needs to be say, 100% height, it’s a PITA to calculate that 100% if there’s margin or padding on an enclosing tag.

blog comments powered by Disqus