homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / Code, Content, and Presentation / HTML
Forum Library, Charter, Moderators: incrediBILL

HTML Forum

Centering background image in a table IE vs Firefox

10+ Year Member

Msg#: 4107073 posted 4:46 pm on Mar 30, 2010 (gmt 0)


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.



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



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

Msg#: 4107073 posted 2:26 pm on Mar 31, 2010 (gmt 0)

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">

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / HTML
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved