user2129022
user2129022

Reputation:

show background image on td tag

I am trying to show the background image on tag td. and I have code

<td style="background-image:url(../uploadimages/18-2-2013-23-33-01-Lighthouse.jpg);background-repeat:no-repeat;background-size:250px 180px;"></td>

<img src="../uploadimages/18-2-2013-23-33-01-Lighthouse.jpg" />

I test the path by using tag img and it get correct the path but I do not know it's not show in the background image on td tag.

thankyou very much

Upvotes: 13

Views: 123254

Answers (2)

Arif Hosain
Arif Hosain

Reputation: 168

Proper Solution

First of all, you have to specify the width and height of td. Follow the example that will work properly---

<td style="background-image:url(../uploadimages/18-2-2013-23-33-01-Lighthouse.jpg);background-repeat:no-repeat;background-size:250px 180px;   width: 250px; height: 180px;"></td>

Upvotes: 9

Anders Arpi
Anders Arpi

Reputation: 8397

The td won't show a background image because it hasn't got any content, hence there's no space in the td to draw the background. The background-size sets the size of the background, not the size of the container. Try width:250px;height:180px; in the inline style for the td - it should show the image.

Here's a demonstration in jsfiddle. If you remove the width and height settings from the CSS you won't see the image.

Upvotes: 17

Related Questions