PDA

View Full Version : Two background images -Possible?


cortic
02-02-2003, 03:06 AM
Is it possible to put in two background images, I'm looking for a kind of fade in and fade out at the top and bottom of the page, would do it with z-index using an element but IE decides 100% meens nearly all the page lol, so I got a fade in at the top using:

body { background-image: url(back_top.gif); background-repeat: repeat-x }

is there anyway to add:
background-image: url(back_btm.gif); background-positionY: bottom; background-repeat: repeat-x

I can't find anything, which means I'm missing something obvious or its just another dead end, any suggestions on another way to do this would be great too.


Thanks.

meow
02-02-2003, 10:34 AM
It's one per element. Nothing stops you from using a background in 2 elements though. Or 3 or 4 or...

cortic
02-02-2003, 05:13 PM
yea, figured that... is there any way to get an element to spread 100% of the page in IE?

100% leaves a space in IE, even JS screen.width isn't the full page - which is ok for most things, but a background should really be all the background.

I've just the top one in place, continuing work on the rest of the site, if anyone has any suggestions I'd love to hear them...

meow
02-02-2003, 05:19 PM
Block level elements do by default if you don't 'do' anything to them. You are probably talking about the margin/padding browsers apply to BODY.

In your style sheet:
body { margin: 0; padding: 0 }

GoHF
02-02-2003, 05:36 PM
- NON CSS APROACHES -

for IE: <body leftMargin=0 topMargin=0 rightMargin=0 bottomMargin=0>
(right and bottom margins are usually not necessary)

for NS: <body marginHeight=0 marginWidth=0>

- CSS APROACH -

for all CSS enabled:<style> body {margin:0}</style>

I've never found padding to be messing with the body, by default.

meow
02-02-2003, 05:41 PM
Some browsers apply margin and some apply padding. IE and Moz - margin, Opera - padding.

cortic
02-02-2003, 06:51 PM
thanks meow & GoHF body {margin:0} worked a treat.