centering a layout horizontally

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

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

  <title>centering a layout horizontally</title>
  <style type="text/css" media="screen">
    body {
      text-align:center;
      min-width:600px;
    }

    #wrapper {
      margin:0 auto;
      width:600px;
      text-align:left;
      background-color:#eee;
      border:3px solid #ddd;
    }
    
    p { padding:0 1em; }
  </style>
  
</head>

<body>
  <div id="wrapper">
    <p>content</p>
  </div>
</body>
</html>

Related examples in the same category

1.	'p' creates a paragraph
2.	p color: blue;
3.	P color: #6D7072;
4.	HTML for a very simple web page
5.	HTML for a simple "Hello World" web page
6.	Paragraphs tag
7.	Different methods of separating paragraphs
8.	Get attribute of a paragraph in Javascript
9.	Using inline styles
10.	Paragraph highlighting
11.	p {clear:right;}
12.	p {counter-increment: paragraphNumber;}
13.	p visibility:hidden;
14.	p color:#999999;
15.	p clear: left;
16.	p color: darkblue;
17.	p.invisible {visibility:hidden;}
18.	A web page with a heading and two paragraphs
19.	paragraphs, block quotes, and address blocks in HTML
20.	CSS styles for paragraphs, block quotes, and address blocks
21.	paragraphs and line breaks
22.	The level-four heading is incorporated into the following paragraph5
23.	Break and Paragraph Example
24.	Mark paragraph by class name
25.	how the color property changes foreground color of the paragraph.
26.	This paragraph has a class attribute whose value is QuickTip.
27.	paragraph with id
28.	Inline style for P
29.	Pseudo-element Selectors
30.	justified static line
31.	'unselectable' specifies whether or not an element can be selected

centering a layout horizontally : p « Tags « HTML / CSS

Related examples in the same category