Naju
Naju

Reputation: 1541

css background image positioning is working differently in firefox

I am using an image as bottom line of a table cell.

 background-position: -14px bottom !important;

The above code is working fine for the background positioning of the image in all browser except Mozila.

So I changed to below code:

background-position: -14px 0!important;

It is also working fine in all browser but in Firefox it gives 1px gap at the bottom.

What is the difference between the code as bottom and 0px????

Please advice me,How to overide this issue to hide the bottom 1px gap?

Upvotes: 0

Views: 99

Answers (2)

Paramasivan
Paramasivan

Reputation: 791

Try to use

table { 
border-spacing:0;  /*  'cellspacing' equivalent  */
border-collapse:collapse;
}

table td, table th
{
padding: 0; /* 'cellpadding' equivalent */
}

table, th, td
{
border:0;
}

Upvotes: 1

Aaron Lee
Aaron Lee

Reputation: 1156

As far as I am aware there isn't a major difference between 0px and bottom, they're both telling the image to sit at the bottom of the div, however I do believe the problem stems from Firefox's user agent stylesheet.

Try putting a reset css before the rest of your CSS, this tends to clear up most issues with cross browser user agent stylesheet problems.

http://meyerweb.com/eric/tools/css/reset/

Upvotes: 2

Related Questions