PDA

View Full Version : cannot make it in the middle....


nikibi
02-24-2012, 06:04 AM
Hello everybody,

I've already type below css but it didn't show the box and in the middle.

body {
margin:0;
padding:0;
color:#FF0;
background-color:#26a;
}

#outerGroup {
width:700px;
margin:0 auto;
padding:1em 2em;
background-color:#fff;
color:#000;
}

and also please check my source code too:


<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>sample</title>
<link href="test.css" rel="stylesheet" type="text/css" media="screen,projection" />
<link href="style-test.css" rel="stylesheet" type="text/css" media="screen,projection" />
</head>

<body>
<div id="outerGroup">
<div id="header"><h1>Hello nikibi</h1>
</div>
<div id="contentGroup">
<h2>I'm learning CSS</h2>
<div id="globalheader">
<ul id="glabaknav">
<li id="ch-A for apple">A for apple</a></li>
<li id="ch-B for boy">B for boy</a></li>
</ul>
</div>
<hr class="colb"/>
Hello
hehe haha hoho
<h2>I'm learning CSS</h2>
<h3>I'm learning CSS</h3>
<h2>I'm learning CSS</h2>
<h4>I'm learning CSS</h4>
</div>
<hr/>
<div id="footer">goodbye</div>

</body>
</html>


thank you for your help!

Corrosive
02-25-2012, 10:45 AM
Your div tags are unbalanced so I don't think you've closed the 'outergroup' div to make the page centre :)

Corrosive
02-25-2012, 10:49 AM
To add to that, this can be avoided if you comment each closing div tag. I use this method but you can find your own;

<div id="wrapper" class="outer"></div><!--\#wrapper .outer-->

By my comment (<!--\#wrapper .outer-->) I mean that the div with ID wrapper and class outer is closed with that closing tag. That way, when it appears half way down the page I know that my div is closed.

Hope that helps make sense of the chaos!