Content Positioning in the center

**freeroxy** · 06-09-2009, 04:05 AM

Hello, thank

I'm wondering how to position the website content in the middle and how to content not movable? For example, on my website, ( www.bonniechoigallery.com) I can get empty space on the right eternally if I enlarge the window to the right side. So, all the content which supposed to be positioning in the middle don't position where it should be... also, whenever I open the window with different browser, it gets different shape and size....... I set the right and left margins to 0, but unfortunately, that seemed to not enough solution to fix this. Could you please please let me know how to fix that problem? My background body is jpeg file. And, the width of window is 1000.

Thank you so much for your help and could I look forward to hearing from you?

Best Regards and Many Thanks
Bonnie

**vwphillips** · 06-09-2009, 10:50 AM

sure there must be a better CSS method but

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
  <title></title>
<style type="text/css">
/*<![CDATA[*/
#content {
  position:absolute;left:100px;top:50px;width:400px;height:400px;background-Color:red;
}

/*]]>*/
</style>

<script  type="text/javascript">
/*<![CDATA[*/

function Resize(){
 var obj=document.getElementById('content');
 obj.style.left=(zxcWWHS()[0]-obj.offsetWidth)/2+'px';
}

function zxcWWHS(){
 if (window.innerHeight) return [window.innerWidth-10,window.innerHeight-10,window.pageXOffset,window.pageYOffset];
 else if (document.documentElement.clientHeight) return [document.documentElement.clientWidth-10,document.documentElement.clientHeight-10,document.documentElement.scrollLeft,document.documentElement.scrollTop];
 return [document.body.clientWidth,document.body.clientHeight,document.body.scrollLeft,document.body.scrollTop];
}



/*]]>*/
</script>
</head>

<body onload="Resize();" onresize="Resize();" >
<div id="content" ></div>
</body>

</html>

Thread: Content Positioning in the center

Thread Tools

Search Thread

Content Positioning in the center

Bookmarks

Bookmarks

Posting Permissions