PDA

View Full Version : why won't it work...

Winterworks
07-22-2009, 04:42 PM
Okay, I have a header on a blank page. Right now, it's aligned to the left, touching the side of my browser.

I want to have an imaginary 900px wide, 100px high box, with the header in it. (not repeating though, as the header image itself is only 300px wide).

I want the imaginary box to be centered, and the header to the very left of that imaginary box.

Here's some codes I have..

Stylesheet.css:
.header {
position:relative;
background:#ffffff url('images/header.png') no-repeat;
height:100px;
width:900px;
padding:0;
color:#ffffff;
align:center;
}

Index.html:

<body>
<div class="header">&nbsp;</div>
</body>

Why won't it work?
Dismounted
07-23-2009, 06:11 AM
CSS does not have an "align" property. Try "text-align" instead.
1Unreal
07-23-2009, 03:38 PM
You can't align layout elements with text-align. You have to give it a width and then use margin: auto;

.header {
position:relative;
background:#ffffff url('images/header.png') no-repeat;
height:100px;
width:900px;
padding:0;
color:#ffffff;
margin: auto;
}