Tell Me About Tiling A Background Image On Footer

**Loaf** · 05-22-2010 01:34 AM

I need to tile a PNG image across the bottom of a HTML page. Done a search, found one method but it didn't work too well. Can someone help me out with some CSS code?

**Hot Chocolate** · 05-22-2010 01:49 AM

I'm volunteering, I need some more details though. From the top of my head: Style="background-image: link.png;" Then you might need to add something like repeat-x or repeat-y or no-repeat, whatever you want. The Style goes into the div element. By the way, PNG isn't the best file format for sites, they take much too long to load.

EDIT: Ok I did some research: it's the following: style=" background-image: url(link.png); background-repeat: repeat-x;" You can change repeat-x to repeat-y or no-repeat. If you don't have any repeat at all, it will repeat in both directions.

**Loaf** · 05-22-2010 02:08 AM

I'm pretty sure PNG is "portable network graphics" designed to be fast for loading online and over networks.
Anyway, I tried something similar (but using 'repeat-x left bottom' or something like that) but I can't seem to get it to work. In CSS, you can use body {code} to change values for body. Is there not a similar thing for footer? This is just becoming frustrating and confusing.

**Puffin** · 05-22-2010 02:12 AM

First, classify the div layer. It should look like "<div class="YOURNAME">

Try this in between your <style></style> tags.

Code:

YOURNAME {background-image:URLHERE}

It should automatically tile. "Body" tells the code to use whatever's inside the brackets for the whole page. So if you want anything at all to be applied to the whole of whatever you specified, such as font-face, font-size, etcetera, put all that inside the "body" brackets.

**Loaf** · 05-22-2010 02:15 AM

Okay, wait...
I was trying this:

background-image:url('Image/bottomloop.png') fix repeat-x left bottom;

But it doesn't appear to work. I have two other backgrounds being tiled in the body css too.