Basic CSS query

I wish to have an image tile down the right hand side of the fluid page as
if it was part of the background.
The intention is to have the page imitate the look of an American football
pitch with the markings down each side of the page.
I have a tiling graphic as the background which takes care of the page
background and the left side markings.
I have created an image to tile down the right side showing the markings,
but need to know how to control it in the CSS.

A second aspect to the query is how would I specify that the total
background effect be:-
(1) Stationary as the page is scrolled vertically,
(2) Scroll with the page contents.

Advertisements

KiwiBrian wrote:
> I wish to have an image tile down the right hand side of the fluid page as
> if it was part of the background.
> The intention is to have the page imitate the look of an American football
> pitch with the markings down each side of the page.
> I have a tiling graphic as the background which takes care of the page
> background and the left side markings.
> I have created an image to tile down the right side showing the markings,
> but need to know how to control it in the CSS.

body {
background-image: url("marble.gif") ;
background-position: top-right ;
background-repeat: repeat-y ;
}
> A second aspect to the query is how would I specify that the total
> background effect be:-
> (1) Stationary as the page is scrolled vertically,
> (2) Scroll with the page contents.

These two are contradictory, of course. In order, it's
background-attachment: fixed ;
background-attachment: scroll ;

Advertisements

On Fri, 11 Jul 2003 18:33:32 GMT, Brian
<-remove-this-part> wrote:
>KiwiBrian wrote:
>> I wish to have an image tile down the right hand side of the fluid page as
>> if it was part of the background.
>> The intention is to have the page imitate the look of an American football
>> pitch with the markings down each side of the page.
>> I have a tiling graphic as the background which takes care of the page
>> background and the left side markings.
>> I have created an image to tile down the right side showing the markings,
>> but need to know how to control it in the CSS.
>
>with background and related properties.
>
>http://www.w3.org/TR/REC-CSS2/colors.html#q2
>
>Something like
>
>body {
> background-image: url("marble.gif") ;
> background-position: top-right ;
> background-repeat: repeat-y ;
>}

I think that this may not help, as he says he already has a background
graphic for the left side of the page. AFAIK there is no way to put two
background images on (under?) the same element. The only thing that
comes to mind is to put a narrow DIV on the right side, just wide enough
for the graphic, but that implies using HTML for presentation, plus
you'll be back shortly posting about how to get it to go all the way to
the bottom of the page. I guess you might be able to do something
involving tables or frames, but that's like using a hammer for brain
surgery.

"Jacqui or (maybe) Pete" wrote
> Brian wrote
> > I wish to have an image tile down the right hand side of the fluid page
as
> > if it was part of the background.
> > The intention is to have the page imitate the look of an American
football
> > pitch with the markings down each side of the page.
> Maybe something like: http://porjes.haxorz.org/one.html

Wonderful!!!
Thanks so much.
It doesn't matter, but I am interested in why the side graphics are not
fixed. They scroll with the page even tho the CSS says fixed. I am using
IE6.

Share This Page

Welcome to The Coding Forums!

Welcome to the Coding Forums, the place to chat about anything related to programming and coding languages.

Please join our friendly community by clicking the button below - it only takes a few seconds and is totally free. You'll be able to ask questions about coding or chat with the community and help others.
Sign up now!