Member Avatar for Violet_82

Hi all, I am having a few problems with a css. Basically in my conditional css I need to target IE9 and below (IE9 included). Now, I have this:

<!--[if IE 9]>
...
<![endif]-->

and

<!--[if lt IE 9]>
...
<![endif]-->

Can I combine them together somehow?
thanks

  • 2 Contributors
  • 2 Replies
  • 73 Views
  • 16 Hours Discussion Span
  • Latest Post Latest Post by Violet_82

Dani AI

Generated

Conditional comments are an IE-only feature that work through Internet Explorer 9; as pointed out, the conditional operator for "less than or equal to" covers IE9 and earlier. Keep in mind that Internet Explorer 10 and newer (and Edge) do not support conditional comments, so relying on them forever will miss modern IE builds.

For maintainability, an alternative is to detect IE at runtime and scope legacy rules with a class on the html element. This keeps all rules in normal stylesheets and avoids scattering conditional blocks. Example approach: add a class when the browser exposes an IE document mode of 9 or lower, then write CSS rules scoped to that class.

if (document.documentMode && document.documentMode <= 9) {
  document.documentElement.className += ' ie-lte9';
}
.ie-lte9 .legacy-widget {
  /* fallback rules for IE9 and below */
}

Document.documentMode is specific to IE, so this will not mislabel other browsers. For feature-based decisions (preferred over version checks), use a feature-detection library such as Modernizr and serve fallbacks only when a required capability is missing. Modernizr

Recommended Answers

All 2 Replies

Member Avatar for JorgeM

Yes, you should be able to use 'lte' ->>> "less than or equal to". So for example..

<!--[if lte IE 9]>
   ...
<![endif]-->

Microsoft reference doc: About conditional comments

Member Avatar for Violet_82

oh brilliant, thanks a lot!

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.