user1940318
user1940318

Reputation:

how to fit image inside TD of HTML table

I am displaying an image inside TD using:

But image seems to be taking larger width than the width defined for the TD.

Please provide me some solution.

Upvotes: 6

Views: 21868

Answers (2)

electrikmilk
electrikmilk

Reputation: 1043

You could try this:

If you want ALL <td>'s to have images:

HTML:

<table class="imagetable">

<tr>

<td>Hey wat up</td>

</tr>

</table>

CSS:

.tableimage td {
background-image:url('http://example.com/image.jpg');
background-size: 100% 100%;
}

If you just want ONE <td> to have an image

HTML:

<td class="image">Hey wat up</td>

CSS:

.image {
background-image:url('http://example.com/image.jpg');
background-size: 100% 100%;
}

Hope this helps :)

Upvotes: 1

aCodeSmith
aCodeSmith

Reputation: 552

CSS solution

td img {
    max-width:100%;
    height:auto;
}

Upvotes: 14

Related Questions