centering a page on ie 7

**d-machine** · 06-26-2010, 05:01 AM

Hi,

On my site, I've tried to center the page horizontally and vertically,
and on IE6-7 the horizontal centering is not working, half of the page is being cut.

What should I do?

Thanks

**molendijk** · 06-26-2010, 02:23 PM

You could try javascript:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">

<script type="text/javascript">
/* Don't modify anything except the values for top, bottom, left and right   */
onload=function(){
document.getElementById('some_div').style.position="absolute";
document.getElementById('some_div').style.top=20+"px";
document.getElementById('some_div').style.bottom=20+"px";
document.getElementById('some_div').style.left=200+"px";
document.getElementById('some_div').style.right=200+"px";

if(/*@cc_on!@*/false)
{
var width_ie = parseInt(document.getElementById('some_div').style.left)+parseInt(document.getElementById('some_div').style.right);
var height_ie = parseInt(document.getElementById('some_div').style.top)+parseInt(document.getElementById('some_div').style.bottom);
document.getElementById('some_div').style.width=document.documentElement.clientWidth-width_ie+'px';
document.getElementById('some_div').style.height=document.documentElement.clientHeight-height_ie+'px';
}

}
</script>

<title></title>
</head>

<body style="background: sienna">
<div id="some_div" style="border: 1px solid black; background: lightyellow">CENTERED DIV</div>

</body>

</html>

In order for this to work in IE, your page must validate.
Arie Molendijk

Thread: centering a page on ie 7

Thread Tools

Search Thread

centering a page on ie 7

The Following User Says Thank You to molendijk For This Useful Post:

Bookmarks

Bookmarks

Posting Permissions