CODEWITHSUNDEEP
htmlcssimagehtml-table
Kyle
Kyle

Reputation: 607

css 3 images in td

I'm having trouble adding 3 images to a table cell in css and was wondering if anyone could help me to figure out what I'm doing wrong. Here is what I have:

css 

.Example {
        background-image:url("image1.gif"),url("image2.gif"),url("image3.gif");
    background-position: top left, top center, top right;
    background-repeat: no-repeat, repeat-x, no-repeat;
}

html

<td class="Example">
    <a href="example">Example</a>
</td>

When I open the page however, all I get is a cell that says Example with no background image. Any suggestions?

Upvotes: 2

Views: 2412

Answers (3)

Nope
Nope

Reputation: 22339

Having multiple background images in the same element and the current limitations have been answered here: layering-images-in-css-possible-to-put-2-images-in-same-element and also here: an-i-have-multiple-background-images-using-css

Currently not all browsers support that feature as stated in the answers in the above links. There is also suggestions to work-arounds, such as using multiple Divs and placing each image into its own div and using z-orders to display divs as required.

Upvotes: 1

Jeff Norman
Jeff Norman

Reputation: 1044

Try 

.Example {
background-image:url("image1.gif"),url("image2.gif"),url("image3.gif");
background-position: top left, top center, top right;
background-repeat: no-repeat;
}

without the three parameters on background-repeat.

And keep in mind that this is not working on every browser.

I suggest you use the old fashion way to resolve this. Put a link on every picture with the same href.

Upvotes: 2

Shikiryu
Shikiryu

Reputation: 10219

The only browser projects having this feature implemented so far are WebKit and KHTML (Konqueror). This got into Safari 1.3 though, and works in OmniWeb 5.5 and up.

Source

Upvotes: 1

Related Questions