Center align in css?
I'm having trouble center aligning a div.
#pageheader {
width:750px;
height:150px;
background-image:url(http://www.silonetwork.com/images/header.gif);
background-repeat:no-repeat;
background-position:center; }
-------
What is the code?
KeithMcL posted this at 15:24 — 27th September 2003.
He has: 176 posts
Joined: Oct 1999
Are you trying to center align the background image or the text?
Suzanne posted this at 16:14 — 27th September 2003.
She has: 5,507 posts
Joined: Feb 2000
for the whole div:
margin-right: auto;
margin-left: auto;
But it doesn't work in IE5 (not sure about IE6, either) -- they don't support this basic standard, but if you look for it in Google or at css-discuss.org you'll find some solutions such as: http://archivist.incutio.com/viewlist/css-discuss/30778?highlight=center+div+IE5+margin
text is centered by using:
text-align: center;
nuk3 posted this at 16:42 — 27th September 2003.
They have: 238 posts
Joined: May 2002
I actually want to center align the image/background.
Suzanne posted this at 17:21 — 27th September 2003.
She has: 5,507 posts
Joined: Feb 2000
Within the div?
backgrounds are not supported well in older browser (for placing), but this is the code (which you can easily look up, btw -- any CSS editor or reference has this information):
background-position: center center;
where the first center is one of left/center/right and the second is one of top/center/bottom.
However, if the div isn't centered, the image will be centered only within the div itself and will not appear centered on the page.
nuk3 posted this at 03:03 — 28th September 2003.
They have: 238 posts
Joined: May 2002
Thanks for that. You say that backgrounds are not compatible for placing in older broswers so is it possible to include an image on a page using css? (Instead of it being a background) Or is that just as incompatible?
Suzanne posted this at 04:55 — 28th September 2003.
She has: 5,507 posts
Joined: Feb 2000
Yes you can use background images -- it's the POSITION declaration that doesn't work in older browsers (like N4.x) because it's not supported. The image will default to the top left and you won't be able to control it.
Of course you can include an image using CSS, using class or id, and calling the image as a source. Your question was about a background-image, however.
nuk3 posted this at 13:08 — 28th September 2003.
They have: 238 posts
Joined: May 2002
Ok, thanks for your help Suzanne.
Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.