Make background image of td to fit to 100% for non static images

Question

I have td tag:

<td class="np-logo" style="width: 228px; height: 50px;">
                                            </td>

And CSS:

.np-logo
{
background-repeat: no-repeat;
background-size: 100%;
}

And i am changing the image according to company logo.and all images have different-different size and width.

.np-logo{background-image:url('" + companylogo + "');

The problem is images are not getting fitted to td correctly.i want them to occupy whole td .but for every company the background image position is non uniform.I even tried using java script on image load to fit to container. didn't worked though.

any help guys...?

Answer 1

Try

background-size: 100% 100%;

where first value is for width and the second is for height.

You can know more about it by following this link

Answer 2

Have you tried cover?

.np-logo {
    background-repeat: no-repeat;
    background-size: cover;
}