Website Design Edmonton       Website Design Feedback       Website Design Sitemap     Contact Website Design Company
Website Designers R Us - Home
Table background image tiling in Netscape A quick solution

So you want to discipline Netscape and not let it tile your precious background table image?

For those who don't know what I'm talking about, here is the problem in detail.
Netscape tends to repeat the background image of a table in each table cell. This leads to tiling of the image (used as a background for a table) if the table contains 2 or more cells.

Here is the faulty table...(check out the great Merc!). If you are viewing this page under Internet Explorer, you won't find anything wrong with the table... how about checking it in Netscape?

And the code is:

<TABLE BACKGROUND="thee250.jpg" WIDTH="250" HEIGHT="150" 
BORDER="0" CELLPADDING="0" CELLSPACING="0">
<TR>
<TD ALIGN="CENTER" VALIGN="TOP"><FONT COLOR="#FFFFFF"
><B>Cell 1</B></TD>
<TD ALIGN="CENTER" VALIGN="TOP"><FONT COLOR="#FFFFFF"
><B>Cell 2</B></TD>
<TD ALIGN="CENTER" VALIGN="TOP"><FONT COLOR="#FFFFFF"
><B>Cell 3</B></TD>
</TR>
</TABLE>

thee250.jpg is the picture of the Mercedes used as background image for the table.

You can go through the code again and again and yet again... but you can't find a fault with it. It is just Netscape's way of rendering the table. In I.E. the table is displayed perfectly.

Let's write the code that works for Netscape as well as for I.E.

<TABLE BACKGROUND="thee250.jpg" WIDTH="250" HEIGHT="150" 
BORDER="0" CELLPADDING="0" CELLSPACING="0">
<TR>
<TD>
   <TABLE WIDTH="250" HEIGHT="150" BACKGROUND="some.gif">
   <TR>
   <TD ALIGN="CENTER" VALIGN="TOP"><FONT COLOR="#ffffff">
   Cell 1</FONT></TD>
   <TD ALIGN="CENTER" VALIGN="TOP"><FONT COLOR="#ffffff">
   Cell 2</FONT></TD>
   <TD ALIGN="CENTER" VALIGN="TOP"><FONT COLOR="#ffffff">
   Cell 3</FONT></TD>
   </TR>
   </TABLE>
</TD>
</TR>
</TABLE>

The Magic - Displaying the correct background image in Netscape

You'll notice that I have introduced another table inside the one that has the background Merc image. This table has a background image attribute too - the background image is 'some.gif'. However, some.gif does not exist. You can use any name here (as long as the image file doesn't exist). A more purist approach would be to use a 1X1 pixel transparent gif image to avoid any kind of complications.



Return to Listing

Website Designers R Us is a professional Internet strategy and Web design company based in Toronto, Canada. We specialize in best-in-class website design, online marketing, Flash multimedia, corporate identity and print graphics. Website Designers R Us features an integrated team of web consultants, creative designers, writers, programmers and marketing professionals that know how to get online results
 Home          ::             About Us          ::             Support            ::             Services            ::             Link Partners          ::             Contact

Copyright © 2006-2011 Website Designers R Us, a DOT Specialist Company. All rights reserved.