This example shows how to use a background that works in both FireFox and Internet Explorer without repeating the background. There are two ways shown here, inline and using <style> tags, because the original question received responses with both approaches.
This page will remain online for future reference. The original question can be viewed at Experts-Exchange, but requires (free) membership. More information about me, about how this site is maintained and about how to use these pages for yourself, check out the opening page.
I also tried to implement the rashgang-solution, but that had to go on a separate page as it was indeed not CSS compliant (extra semi-colon, probably a typo)
| Display background using inline styles | |
|---|---|
| This is one single TD with a background image (yes, it is ugly and sitting on the top-left) |
Using (credit abel, yes that's me ;-)
style="height:185px;background:url(images/background.png) no-repeat;" |
| This TD does not have a background image anymore | |
| Display background using <style> tag styles | |
|---|---|
| This is one single TD with a background image (yes, it is ugly and sitting on the top-left) |
Using inside <style> (credit dachusa)
.with_background td {
background:url(images/background.png) no-repeat;
height:185px;
}
And inside the HTML, using:
<table class="with_background">
|
| This TD does not have a background image anymore | |
| Display background using inline styles (OP's way) | |
|---|---|
|
This is one single TD with a background image (yes,
it is ugly and sitting on the top-left)
|
Using (credit Ameerh24, the OP)
style="height:185px;background-image:url(images/background.png); background-repeat:no-repeat;"and a <div> inside the <td> |
| This TD does not have a background image anymore | |