continuing background

[acorn71]

Hello,

I have a background image that needs to continue to infinity.
Currently, I have a band-aid solution where I've made my background
image 3000px and kept it pretty small in file size with the height set
to 'auto'. However, I've always wanted to do this the right way and was
hoping someone could help me and/or point me to a good tutuorial
creating infinity backgrounds with nested <div>'s.

The page I'm working on can be found at
http://www.smartwebdevelopment.com/css/cities.html

Thanks in advance for any suggestions.

Aaron

[Ben C]

On 2006-10-12, acorn71 <ac*****@gmail. comwrote:

Hello,

I have a background image that needs to continue to infinity.
Currently, I have a band-aid solution where I've made my background
image 3000px and kept it pretty small in file size with the height set
to 'auto'. However, I've always wanted to do this the right way and was
hoping someone could help me and/or point me to a good tutuorial
creating infinity backgrounds with nested <div>'s.

The page I'm working on can be found at
http://www.smartwebdevelopment.com/css/cities.html

You could divide your image into two images, the top bit, and the bit
below that that goes on forever.

Then put another div outside .pageBlockTop with the repeating bit as a
repeating background image:

<div style="backgrou nd-image: url("stripe.jpg ");
background-repeat: repeat-y">
<div class="pageBloc kTop">
</div>
</div>

Then you can edit your 3000px image to be just long enough to get as far
as the repeating stripe at the bottom.

Also set background-color: transparent on pageBlockTop (although it's
usually the default anyway).

[Chris F.A. Johnson]

On 2006-10-12, acorn71 wrote:

Hello,

I have a background image that needs to continue to infinity.
Currently, I have a band-aid solution where I've made my background
image 3000px and kept it pretty small in file size with the height set
to 'auto'. However, I've always wanted to do this the right way and was
hoping someone could help me and/or point me to a good tutuorial
creating infinity backgrounds with nested <div>'s.

The page I'm working on can be found at
http://www.smartwebdevelopment.com/css/cities.html

Since you want solid colours, use background colours.

(And while you are at it, get rid of the fixed px-sized widths.
See how it looks in my browser at
<http://cfaj.freeshell. org/testing/roomers.jpg>.)

--
Chris F.A. Johnson <http://cfaj.freeshell. org>
=============== =============== =============== =============== =======
Author:
Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)