Centering nested divs
Once again开发者_Python百科 I'm having issues centering divs...
http://www.srcf.ucam.org/~sas98/project.php
How would I go about centering everything in #main?
try: margin: 0 auto; display: table
No width needed, nothing. Tested in Chrome.
Use doctype for your HTML -
<!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">
second - add to main class this :
margin: 0 auto;
EDIT: And make main width in pixels
First, make sure you have the correct doctype.
The key to centering using margin: 0 auto;
is making sure that the same div has a static width.
#main { width: 980px; margin: 0 auto; }
To center <div class="main">
(and it is a class
- that means it's .main
, not #main
- your HTML and CSS do not agree with each other on this point):
- Add
margin: 0 auto; width: 1020px
to.main
.1020px
is the right number to use here. - You also need to remove
width: 100%
frombody
, or your centering will not be precisely correct. - You should also remove
overflow: hidden
frombody
, or scrolling is impossible on your page.
Lastly, add a proper doctype as the very first line, or your page is in Quirks Mode and you'll in particular have big problems with Internet Explorer:
<!DOCTYPE html>
I'm not sure what your footer is supposed to be doing.
精彩评论