Doctype | Expressing IT

Dec 17 2008

Mis-behaving IE8 : CSS Layout breakages (Targeting a browser version using Meta Tags in IE8)

If you are css person, you would know the pain in getting your layouts working cross-browser. IE8 is yet another spanner in the works for us developers. Anywaz! if you hit upon this issue, Like I did yesterday, where your perfectly working CSS in IE7 (and earlier) and Firefox has suddenly started throwing tantrums in IE8 , TRY This … It nicely seemed to fix my problems for the moment ….

Using Meta declaration, we can specify the rendering engine we would like IE8 to use. So to force IE8 to render as IE7 … Insert the following Meta Tag into the head of your document:-

<meta http-equiv=”X-UA-Compatible” content=”IE=7″ />

By default IE Meta would be:-

<meta http-equiv=”X-UA-Compatible” content=”IE=8″ />
which would make IE8 render the page using the new standards mode.

If required, this syntax could be used to accomodate for other browsers as below:

<meta http-equiv=”X-UA-Compatible” content=”IE=8;FF=3;OtherUA=4″ />

MORE About DOCTYPES :

IF you are yet unfamiliar with the sort of animal called “Doctype” … here is some quick read
What are DOCTYPES? What are BROWSER QUIRKS & STRICT Mode?
Setting the DOCTYPE in XSL

For a more in depth understanding about DOCTYPES , try visiting these links…
A List Apart : Fix Your Site With the Right DOCTYPE!
A List Apart : Beyond DOCTYPE: Web Standards, Forward Compatibility, and IE8

Note: Though many of us HTML/CSS people have been neglecting the importance of DOCTYPE decleration in our documents , Setting the right DOCTYPE , is usually the answer to most cross browser issues.

1 comment | tags: Doctype, IE Issues, IE8, Meta Tags, Tips & Tricks | posted in Browser Quirks, HTML

Aug 2 2008

Setting the DOCTYPE in XSL

Last week I created a progessive HTML/CSS layout for a client, tested it in IE6, IE7 and FF 3, seemed perfectly fine… UNTIL! the layout went further down the manufacting cycle. It failed. Page layout elements just went all over the place when the HTML layout was converted into XSL and XML applied to it … Bummer!!!

Could not sleep ok over the weekend, in anticipation of Monday morning, when I’ll have to fix this SH**. But now having a little experince in dealing with these kind of situations ( Browser Quirks, I mean), I knew it had to do with nothing else but DOCTYPE…. and It WAS…

The Problem:
You want control over the DOCTYPE, since your transformation will include a default DOCTYPE explicitly, and you layout will be out for a toss.

The Solution:
XSLT specs provides output methods to set a the DOCTYPE of choise. Also, for us UI developers, the topics of interest would be HTML output methods and XML output methods.

Well! before you get bored , here is the fix.

For eg., if you had the following DOCTYPE in your HTML version :-

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Then in the XSL you would have to have the following :-

<xsl:output method="html" doctype-system="http://www.w3.org/TR/html4/loose.dtd" doctype-public="-//W3C//DTD HTML 4.01 Transitional//EN" indent="yes" />

and Finally! do make sure your XSLT output obeys the DOCTYPE you have chosen.

1 comment | tags: Browser Quirks, Doctype, XML, XSL | posted in XSL

Sep 15 2007

What are DOCTYPES? What are BROWSER QUIRKS & STRICT Mode?

Simple speaking (for those who never heard about doctype before today)! DOCTYPE is the declaration in a HTML document that comes before the <HTML> tag, that looks something like this ( pasted from the source of this very page)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Why use doctype?
It all began when browser standards were introduced by W3C. The earlier web developers implemented CSS according to the wishes of browsers, to have the pages rendered correctly in them and most websites had CSS that didn’t quite match these specifications/standards.

Therefore solution to this problem was to

allow web developers who knew their standards to choose which mode to use.
continue displaying old pages according to the old (quirks) rules.

And DOCTYPE was born.

So, based on whether you page is designed to standards or not , you choose the appropriate doctype.

Relation between Doctype & Browser modes
Doctype is the statement that tells your browser what mode it should render the HTML page in or rather to be more precise how should the browser interpret the CSS in; Quirks Mode or Strict mode.

Old pages written before these standards were introduced don’t have a doctype. Therefore when there is no DOCTYPE in your HTML then the browser is in QUIRKS mode.
But if the DOCTYPE is defined as one of the following , then the browser is said to be in STRICT Mode.