CSS Bugs - Solutions Types


CSS bugs in IE come in different shapes, sizes and colors. So do the solutions to fix those bugs:

  • Is proprietary code needed to fix the bug?
  • Is the solution one line of code or twenty?
  • Does solution code validate? Will it validate in future?
  • Does solution require use of conditional comments in order to target a specific version?
  • Does solution require use of JavaScript or other technologies?
  • Does solution exist at all?

In hasLayout.net bug tables you will find "Solution Type" column with the solution code for each bug. Descriptions of each "Solution Type" code are listed below.

Pseudo Bug


This is a special case. The bugs classified under this section are not real bugs but may appear to an unsuspecting developer as such. The problem could be the use of improper code or a bug in the testing environment (e.g. ies4linux or browser shots sites).

Side Effects

This is an additional code to solution type codes which indicate that a particular solution has some side effects.
Side effects may include incomplete fix or triggering of other bugs.

Clean Solution


These kinds of solutions are generally considered the best to use. They don't require the use of conditional comments or any specially crafted code. The fix is usually a moderate amount of code that can be used right in your main stylesheet.

Clean Markup Solution


This type of solution is similar to `Clean` solution with the exception that you may need to edit or add some markup as well.

Future Clean Solution


These solutions generally would fall under Clean Solution category, but they have an exception. They code introduced in these solutions will not validate under current, widely implemented CSS version. However, the code used is proposed in future versions of CSS thus is likely to be valid sooner or later. For these reasons, the solution code is presented inside conditional comments, however authors are noted that such solution may be classified as Clean Solution once the code used by the solution will be widely implemeneted and will validate.

Layout Solution


The solution usually includes setting hasLayout to true and possibly some clean solution. These kinds of solutions will be presented inside conditional comments. However, conditional comments often will not be necessary depending on particular situation since there are various ways of giving "layout"

Please read and understand what hasLayout is before using the solution.

Conditional Comments Solution


The solution uses condcoms to target either IE only or even specific versions of IE. The solution does not have to be implemented with conditional comments. The key word is "targeting specific IEs" and condcoms are the author's prefered way of doing this.

JavaScript Solution


This type of solutions rely on the use of JavaScript (JS).

The solution will present you with JavaScript code which will fix the problem presented in the demo. However, keep in mind that on your particular website such code may be optimized depending on your specific situation.

If IE gives you too much headaches you may want to consider using Dean Edwards IE7 script.

Since browsers allow user to disable JS, these kinds of solutions are last resort since they won't work at all if IE user has JavaScript disabled.

In my personal opinion I believe that most IE users do not dig through a bunch of menus to disable something they don't know about. However, there may be cases where some security application may turn off JavaScript for the user. With above said I still prefer pure CSS solutions as they work more smoothly.