Wednesday, October 10, 2012
Centering Layout
To center web content in a browser window (always center content no matter the size of the broswer window), involves the following steps (to be applied only after all development issues have been resolved):
1. Opening and closing div with id name added to contain all page content (opening div goes right after opening body tag, closing div goes right before closing body tag)
<body>
<div id="mainwrapper">
[all other code that creates page content (images, text, links, etc)
should go here between opening and closing wrapper div]
</div>
</body>
2. CSS Rule for wrapper should at the very least include these properties and values. Value for min-width and max-width will be unique based on your design layout width
.mainwrapper{
max-width:600px;
min-width:600px;
position:relative;
margin-left:auto;
margin-right:auto;
}
Labels:
centering,
centering layout
Subscribe to:
Post Comments (Atom)
No comments:
Post a Comment