Stopping images from tiling.
 

I'm trying to figure how to use a background image in a table cell and stop it from tiling. Is there any html code that does this? I'm trying to get a small image in the lower right corner of a table cell to brighten up the page.

You can use .css to fix the position of the background image.

body {
background: url(graphic.jpg) fixed no-repeat;
}

Make sure the edges of the graphic are the same colour as the background colour for the page or it will look funny.

The easier way is to make the background image larger than the cel otherwise it will always repeat if the cel is larger than the image.

Thanks Keith, does that work for table cells or just the body of the entire page.

I'll give it a try and see how it goes.

You can apply a background image to just about any element in modern browsers, and set them to not repeat, etc.

It sounds like you want to target just one cell in your table. Id give that TD and id and in the CSS make a rule like:

td#notile {
background: url(graphic.jpg) no-repeat;
}

You don't need want the "fixed" part unless you want the image to remain stationary on the page (not scroll). The no-repeat is what keeps it from tiling.

Then in the HTML the markup for that table cell would look something like:

<td id="notile">Cell contents</td>

Hope this helps!

//You don't need want the "fixed" part unless you want the image to remain stationary on the page (not scroll). The no-repeat is what keeps it from tiling.//

Good correction. I was doing this last night and didn't cut it out of my example.

Heh. CSS and web design is my area of expertise, so that is why I had to jump in (not to correct, but to help out), since I don't have much to add to anything DV related. Yet.

Best,

Thanks to both of you. I'll see how I go today. I really haven't kept up with my web work that much here in Japan so I really appreciate your input.

What about positioning? The default is top left of the cell but I want it in the bottom right.

Then you can actually just add "bottom right" to the CSS entry.

td.notile {
background: url(graphic.jpg) no-repeat bottom right;
}

Should put it right where you want.

Thanks guys, I fired up Dreamweaver MX and low and behold there it was.