One of the oldest problems in webdesign is related to background images on table rows.
Problem: when you provide a background images (through HTML or CSS) on a table row:
<table> <tr background="bg.gif"> <td>some stuff</td> <td>more stuff</td> <tr> </table>
On Firefox everything would go out as planned. However in older browsers like IE 6, each of the 2 table columns will inherit the background image and you will get a nasty effect.
Solution: You will need to use background-image:none on every table cell while the row needs a position:relative.
<table> <tr style="background-image: url(bg.gif); position: relative;"> <td style="background-image:none;">some stuff </td> <td style="background-image:none;"> more stuff </td> </tr> </table>
RSS feed for comments on this post · TrackBack URI
Leave a reply