1

Apr

Filed in CSS, Code with No comments |

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.

No Responses to "Don’t Use Padding or Margin on BODY Tags"

Subscribe to this topic with RSS or get the Trackback URL

Leave A Reply

 Username (*required)

 Email Address (*private)

 Website (*optional)

Note: Comments moderation may be active so there is no need to resubmit your comment.