for practical use of CSS
copyright © CSSPG, lud April 02 2002
for practical use of CSS
Bugs which are bad enough to make content illegible are shown with this background, and italicized print.
The 'bugs' are arranged by browser version, in reverse chronological order by release date. Bugs which have been fixed have been removed to a separate page.
If your platform isn't listed, it does *not* mean that the bug doesn't exist on it; it just means that no one has _reported_ that it is a bug on that platform. Please help make this a better resource by including platform information when reporting a bug.
Interminable discussions on the CSS newsgroup have revolved around implementation problems and 'workarounds'. This summary is an attempt to provide the collective wisdom gleaned from those posts. No exhaustive attempt is made to describe elements that are unsupported. Reference for such elements should be to the Master Grid provided by Eric Meyer at Webreview.
Deletions will be gleefully accepted; additions will be reluctantly included. Please send corrections to the CSS Pointers Group. Please file bug reports, even if you think someone else may have already filed. Let's do our utmost to get the attention of the vendors, so that we can all realize our goal of delivering the best CSS to everyone.
Opera 3.5+(W=Win) | CSS Property/ Problem | Description | Workaround | Notes/Footnotes |
|---|---|---|---|
| A links | wrong/default color | separate rulesets; don't use comma-separated selectors | W |
| background | doesn't cover area correctly with certain fonts | set padding-bottom | W [example] |
| Cascade: background | <body> background element incorrectly takes precendence over CSS body {background-color: ...} rule | don't declare | W |
| Capitalize with inline elements | incorrectly capitalizes more than first letter | avoid | W Test Suite |
| embedded style | may be ignored if using html comments | separate comment delimiters with a linefeed | W (12) |
| background-image in TD | unsupported | enclose style in DIV (SPAN won't work) | W |
| border | ignored on TABLE, ABBR, ACRONYM, Q | avoid | W |
| border on TD, TR | not rendered | unknown | W |
| float | badly broken | better avoid | W |
| height | based on containing block width | avoid | W (fixed in 3.6) |
| HR with %width | unsupported/buggy | unknown | W(fixed in Opera 5x) demo |
| list-style-image: url(whatever.gif) | list items disappear | cache image by pre-loading | W demo |
| margin | ignored on inline elements, except left and right | unknown | W |
| padding | ignored on inline elements | unknown | W |
| pseudo-selectors | allowed other than at end of selector | illegal usage - avoid | W (fixed in 3.6) |
| text-align: center on TABLE | centers each cell | avoid | W |
| text-decoration: none | not honored on A:pseudo element | declare on A, or wait for bug fix | W |
| vertical-align: % | relative to font-size instead of line-height | avoid | W |
Footnotes [2] Percentage should be applied based on the font size of the parent element. The size is calculated based on the percentage of default font size for the element. ^
[3] CSS1 does not allow negative values on this property. ^
[4] Having the style sheet in the top level or the same directory as the HTML file avoids the 'length' problem with IE3, as well as the NN4 bug which interprets URLs relative to the HTML file instead of the style sheet.
[5] Exceptions are background image and color on TABLE tag. For other styles, results may vary depending on the complexity of the table and their use is not recommended. ^
[6] Selectors cannot start with a dash or a digit. ^
[7] Unpredictable results. Detailed tests by Shelley Powers. ^
[10] See Demo of problem provided by Bill Humphries. ^
[11] See Microsoft's explanation ^
[12]Use:
<!--
LI { list-style-image: url(./caution.gif); }
-->
Instead of:
<!-- LI { list-style-image: url(./caution.gif); } -->
CSS Pointers Navigation
Main Site Navigation
