0

Hello;
I am working on a web page that I have designed to take up 75% of the monitor.
Presently this web page when loaded auto aligns to the left side of my monitor.
While it looks fine I would prefer it to be centered on my monitor. I have tried writing a code that will center my web page but am having no luck.
I'm sure that it is a simple fix but I can't seem to get it to work.
Anyone out there know what code I should use to center my web page?
Thanks.

7
Contributors
6
Replies
10
Views
5 Years
Discussion Span
Last Post by lps
1

Create two divs, outer and inner div. The inner div goes inside of the outer div...

<div class="outerDiv">
  <div class="innerDiv">
    your main content
  </div>
</div>

CSS
.outerDiv {width:75%;margin:auto;}
.innerDiv {style as you would normally for your content}

0

Enclose the body of your page within a DIV tag. Since the goal is to center the entire web page, this should be just about everything within the BODY tag. Place the <DIV> tag immediately after the <BODY> tag and put the closing </DIV> tag just before the </BODY> closing tag.

0

Put that dic inside a another div and set the outside div align to center. Like

<div algin="center">
<div>Your Main Content</div>
</div>
0

Here is what i do:

<div class="wrapper">
    <div class="main-content">
        <h2>Hello World</h2>
    </div><!--end of main content -->
</div><!-- end of wrapper -->


/*CSS Styles*/
.wrapper {background:#fff; boder:1px solid #ddd; margin:0 auto; padding:0 20px width:1024px;}
0

<!DOCTYPE html>
<html>
<head><style>body{width:1000px;margin:auto;}</style></head>
<body>
<p>something goes here</p>
</body>
</html>

BUT if an element is having position absolute, it should have additional style "left:0;right:0;" in order to have it positioned to center.

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.