Welcome to WebmasterWorld Guest from 54.227.52.24

Forum Moderators: incrediBILL

Message Too Old, No Replies

Centering background image in a table IE vs Firefox

     

cmendla

4:46 pm on Mar 30, 2010 (gmt 0)

10+ Year Member



HEllo

I have a situation where I need to center a background image in cell in a table. The site is designed in Frontpage (I know, I know).

There is no doctype statement in the code for the pages.

I believe that the following code was working for both IE and Firefox. It still works ok in IE but in firefox (v3 at least) the image ends up in the top left of the cell.

Is there anything else I could try to get the image centered in firefox instead of ending up in the top left of the cell?

If it works in FF in addition to IE, then that would be Ok.

Thanks

Chris

<td STYLE="background-repeat: no-repeat;"
Style="background-position: center" width="817" background="images/example.jpg">

penders

2:26 pm on Mar 31, 2010 (gmt 0)

WebmasterWorld Senior Member penders is a WebmasterWorld Top Contributor of All Time 5+ Year Member Top Contributors Of The Month



There is no doctype statement in the code for the pages.


Normally you would need a (standards compliant) doctype before even attempting to get the same rendering cross browser. I assume this is out of your control? (As it happens, it's not critical to center the background image in these 2 browsers.)

You should only have 1 STYLE attribute. Firefox is ignoring the 2nd one, so your image is not centered. Merge the two, separated by a semicolon:

<td style="background-repeat: no-repeat; background-position: center;" width="817" background="images/example.jpg">


That should 'work', however, BACKGROUND is not a valid attribute for a TD element (although it is supported by these browsers). The image URL should be made part of the STYLE:

<td style="background:transparent url(images/example.jpg) center center no-repeat;" width="817">
 

Featured Threads

Hot Threads This Week

Hot Threads This Month