Centering nested divs_问答_开发者_运维开发者技术经验分享

Centering nested divs

开发者 https://www.devze.com 2023-03-12 16:00 出处：网络

Once again开发者_Python百科 I\'m having issues centering divs... http://www.srcf.ucam.org/~sas98/project.php

相关专题：centering css

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% from body, or your centering will not be precisely correct.
You should also remove overflow: hidden from body, 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: