SevenCubed
msg:4268128 | 8:26 pm on Feb 16, 2011 (gmt 0) |
Hi olls and welcome to Webmaster World
Short quick solution:
div#header{
background:url(topbackground%20pic.png);
position:absolute; <------ Remove
top:10px;
width:820px;
height:412px;
z-index:100;
margin:0 auto 0; <------ Change
padding:0;
} <----- Add
That will resolve your immediate problem but might create others because I don't know what you plan on doing with header position absolute. If you want everything centred it may be better to have an all-inclusive wrapper and centre that then everything within it will be centred.
|
olls
msg:4268393 | 1:27 pm on Feb 17, 2011 (gmt 0) |
Thanks ill try that.
(i did have the } by the way!)
|
miketopher
msg:4269876 | 7:18 pm on Feb 20, 2011 (gmt 0) |
sevencubed is right
primarily the centering css code is
margin: 0 auto;
this will center the div
|
olls
msg:4270665 | 6:28 pm on Feb 22, 2011 (gmt 0) |
I still can not get it to work, i dont know what i am doing wrong, ive put all the content into a container div and it still wont work, here is the CSS:
div#container{
width:820px;
top:0;
margin:0 auto 0;
border-style:solid;
border-color:red;
}
and the HTML:
<div id="container">
<!-- content -->
</div>
Please help!
|
SevenCubed
msg:4270669 | 6:32 pm on Feb 22, 2011 (gmt 0) |
If you are testing it in Internet Explorer make sure you have whatever doctype you are using such as:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
declared in your html or else it will be rendering in quirks mode and will not center.
|
olls
msg:4270683 | 7:01 pm on Feb 22, 2011 (gmt 0) |
THANKYOU!
finaly ive fixed it, ive been trying to do this for ages! The only problem is ive now mucked ut the positioning for the other elements... i should work it out
|
TheMadScientist
msg:4284376 | 12:24 am on Mar 20, 2011 (gmt 0) |
In case you ever need to do it with absolute positioning:
div#header{
background:url(topbackground%20pic.png);
position:absolute;
top:10px;
right:50%;
width:820px;
height:412px;
z-index:100;
margin:0 -410px 0 0;
padding:0;
}
|
olls
msg:4285306 | 10:16 pm on Mar 21, 2011 (gmt 0) |
thanks, the mad scientist, i had been trying right 50% but couldnt get it to work,this is perfect!
|
vseprav
msg:4288568 | 4:05 pm on Mar 28, 2011 (gmt 0) |
this should be enough
margin:0 auto
|
lucy24
msg:4298754 | 3:29 am on Apr 16, 2011 (gmt 0) |
this should be enough
margin:0 auto |
|
Should be, but isn't ;-)
Some browsers are crotchety about "auto" combined with a numerical value. To be safe, write them out separately as "margin-top: 0; margin-left: auto;" and so on.
|
|
