Home : Stuff : About

Stuff » Internet Explorer Workarounds

Not yet an article, just some outline notes, testing of template logic and switches and syntax highlighting.

Internet Explorer Conditionals

Are used to fix/modify HTML pages for the Internet Explorer family of browsers. Refer to the official Microsoft documentation for full details. This solution benefits from working with any HTML pages, either static or dynamically generated, but is inelegant as the fixes are evident in the source code.

Example 1 - HTML/Template Code
<!--[if IE]>
<p>You <strong>are</strong> using Internet Explorer</p>
<![endif]
-->

Templating Switches

Although relying on server side scripting, a better solution is to identify the browser [1] and dynamically adapt your page coding to suit. The following is based around using the phpBB 3 templating system.

Example - PHP Code
$user_agent_is_ie = ( isset($_SERVER['HTTP_USER_AGENT']) && stripos($_SERVER['HTTP_USER_AGENT'], 'MSIE') !== false ) ? true : false;

The below are all equivalent and which one you use depends on what you are trying to achieve ; if you merely wish to show such simple information as used below then you would use Example 5.

Example 3 - Template Code
<!-- IF USER_AGENT_IS_IE -->
<p>You <strong>are</strong> using Internet Explorer.</p>
<!-- ELSE -->
<p>You <strong>aren’t</strong> using Internet Explorer.</p>
<!-- ENDIF -->
Example 4 - Template Code
<p>You <strong><!-- IF USER_AGENT_IS_IE -->are<!-- ELSE -->aren’t<!-- ENDIF --></strong> using Internet Explorer.</p>
Example 5 - Template Code
<p>You <strong>are<!-- not IF USER_AGENT_IS_IE -->n’t<!-- ENDIF --></strong> using Internet Explorer.</p>

Results in ;

You aren’t using Internet Explorer.

being displayed.

Centering Content

Example 6 - HTML/Template Code
<!--[if IE]>
<div align="center">
<![endif]
-->
Some content to be centred…
<!--[if IE]>
</div>
<![endif]
-->
Example 7 - Template Code
<!-- IF USER_AGENT_IS_IE -->
<div align="center">
<!-- ENDIF -->
Some content to be centred…
<!-- IF USER_AGENT_IS_IE -->
</div>
<!-- ENDIF -->

Notes

[1] This will fail if the browser identifying string has had the ‘MSIE’ part removed — to which I would say let the user live with the consequences.

Home : Top

Last Updated: May 26, 2009 2:11 PM :: © 2009 by Darren Burnhill