Can we solve the table row background image problem, in chrome, in multi celled tables??
- by Ya'el
It is frequently asked – but I haven’t seen a good answer yet (and I looked). If you set a background image in CSS to a table row- the image will repeat itself in every cell. If you set the position: relative (for the row) and set the background-image: none (for the cells) it solves the problem on IE but not on chrome! I can't use background positioning since there are many calls and their size varies. (And the picture is not symmetrical- It's a fade out from one side. Anybody??
Example for the css code :
tr { height: 30px; position:relative;}
tr.green {background: url('green_30.png') no-repeat left top;}
tr.orange {background: url('oranger_30.png') no-repeat left top;}
tr.red {background: url('red_30.png') no-repeat left top;}
td {background-image:none;}
The HTML is basic - A multi cell table.
The goal is to have different colors fade into every row, but it could be any non-pattern image.
