background image

I use CSS to tile an image (in the body tag) background across all of the
page. But, and this is the bit I can't quite figure out, I would also like
to run an orange strip 200px wide (also in the body tag) in the pages
background down the left side of the screen. I have tried to achieve this
by:

style="background: url('art/orange.gif') 0% 0% repeat-y"

The trouble is it repeats down the page as expected but it also covers the
rest of the page with white, so I lose my other image (which is in an
external stylesheet) which is supposed to cover all parts of the pages
bacground which is not covered by the orange strip. So why doesn't the
orange stripe confine itself to the left edge of the screen? I guess its
not possible to have two images in the background of an element - unless of
course you know different.

thanks
David

In post <Sr_Ma.22019$sh4.1532921@newsfep2-win.server.ntli.net>
David Graham said...

> I guess its not possible to have two images in the background of an element

true, stick one of the backgrounds on an element. some browsers
support this:

html{background: ...}
body{background: ...}

--
brucie a. blackford. 04/July/2003 06:05:06 am kilo.
http://loser.brucies.com/

"Richard" <anom@anom> wrote in message
news:be2ca502ohd@enews4.newsguy.com...
>
> "David Graham" <david.graham16@ntlworld.com> wrote in message
> newsr_Ma.22019$sh4.1532921@newsfep2-win.server.ntli.net...
> > I use CSS to tile an image (in the body tag) background across all of
the
> > page. But, and this is the bit I can't quite figure out, I would also
like
> > to run an orange strip 200px wide (also in the body tag) in the pages
> > background down the left side of the screen. I have tried to achieve
this
> > by:
> >
> > style="background: url('art/orange.gif') 0% 0% repeat-y"
> >
> > The trouble is it repeats down the page as expected but it also covers
the
> > rest of the page with white, so I lose my other image (which is in an
> > external stylesheet) which is supposed to cover all parts of the pages
> > bacground which is not covered by the orange strip. So why doesn't the
> > orange stripe confine itself to the left edge of the screen? I guess
its
> > not possible to have two images in the background of an element - unless
> of
> > course you know different.
> >
> > thanks
> > David
> >
>
> AFAIK, you can only have ONE background image.
> What you might want to try is making one image out of two. Merging the two
> together.
> Use the merged as your background and make the height something like 1200
so
> that it won't matter if you scroll the background or not.
> I've taken some tile patterns that were originally meant to be mixed
> together as smaller images, but then I resize the thing to something huge
> with the properties. That way I only get one tile instead of dozens.
> Besides, I don't like the way the lines are visible between tiles.
>
Hi
I should be in bed but Brucie has had me reading a php function. Anyway, I
was more worried about the width. If I merge my 200px wide orange strip with
the other image which is a nice cream textured image, I would need to make
the cream bit really wide to ensure that the combined image went right
across the screen, otherwise using repeat-y will prevent my background from
filling in the right most portion of the screen and I simply couldn't use
repeat, or the orange bit of the merged image would form another orange
strip vertically somewhere in the region of the right part of the screen. I
am worried that if my merged image is very wide, a horizontal scrollbar
would form for clients using a low resolution screen, or is this wrong, do
backgrounds never force scrolling?
Must go to bed now, but look forward to reading any replies tomorrow.
thanks
David

Backgrounds will never cause the page to scroll. If it's too large, it
will just not show completely.

[dforthster]

use html tags so easy for background simply add background="img url" inside your body tag.