Skip to main content

learn advanced html :Conditional Comments

Older versions of Internet Explorer are frequently either inept or naughty. Or both. But they are still popular so we don’t want to ignore them.
Conditional comments, which are nothing more than simple HTML comments that IE (up to version 9) happens to take a peep at, are used to throw a chunk of HTML at these browsers and only these browsers. Other well behaved, top-of-the-class browsers will simply see them as unremarkable comments and move along.



They have become a commonly used method of latching extra CSS to a document to plaster over holes in these browsers’ display capabilities. So, for example, you might add something like this inside your head element:

<link href="everything.css" rel="stylesheet">
<!--[if IE]><link href="stupidie.css" rel="stylesheet"><![endif]-->
Everything between <!--[if IE]> and <![endif]--> will be picked up by Internet Explorer. So this will bolt on a CSS file as normal, and then, only if the browser is Internet Explorer (in practice, this will be Internet Explorer version 9 and below), it will also apply an extra CSS file patch.
You can also target specific versions of Internet Explorer:
  • <!--[if IE 6>…
  • <!--[if IE 7>…
  • <!--[if IE 8>…
  • <!--[if IE 9>…
You can also target all versions that are greater or less than a certain number:
  • eg. <!--[if IE gt 6]>… for IE versionsgreater than 6
  • eg. <!--[if IE gte 8]>… for IE versionsgreater than or equal to than 8
  • eg. <!--[if IE lt 7]>… for IE versions less than 7
  • eg. <!--[if IE lte 7]>… for IE versions less than or equal to 7
There are actually more options than this which are largely totally unnecessary. Take a look atMicrosoft’s own take on it if you really feel compelled to find out more.


Popular posts from this blog

learn advanced html Tables: Columns, Headers, and Footers

The Columns Strike Back Table rows tend to make table columns look rather stupid. They do all the work, as the table is built row by row, leaving the columns feeling quite rejected. Luckily for those eager columns though, the colgroup  and  col  tags have come to their rescue. These tags allow you to define the table columns and style them as desired, which is particularly useful if you want certain columns aligned or colored differently, as, without this, you would need to target individual cells.

learn html for intermediate : Definition Lists

The HTML Beginner Tutorial looked at unordered lists and ordered lists , but, much like Peter Cushing’s Doctor Who,  definition lists  are quite often forgotten. This is maybe because they are much more specific than ordered and unordered lists and therefore less useful, generally, but where there is a list of terms and descriptions (such as a glossary), a definition list is your go-to-element. dl  gets the ball rolling, similar to the  ul  and  ol elements, establishing the list. Rather than containing  li  elements, though, definition lists have  dt  elements, which are the  definition terms , followed by  dd  elements, which are definition descriptions  associated to the  dt elements. There doesn’t have to be one  dt  followed by one dd , there can be any number of either. For example, if there are a number of words that have the same meaning, there might be a number of  dt ’s followed by...

learn advanced html : Accessible Forms

Labels Each form field should have its own explicit label . The  label  tag sorts this out, with a  for attribute that associates it to a  form  element: < form > < label for = "yourName" > Your Name </ label > < input name = "yourName" id = "yourName" > <!-- etc. -->