FRDK Design & Kommunikation

Solving the base href dilemma

You may know this already: there is a problem with using a correct and perfectly valid tag, in Internet Explorer only. The tag is <base>.

To sum up the problem: the <base> tag is used to define a base URL, which can be useful at times. Many competent CMSi use this tag to define the site root, for example. The proper way to write this tag, in XHTML, is this:
<base href="http://myspliffysite.con/" />

Unfortunately for us though, IE doesn’t agree with this. It wants us to write the base tag a different way, which is fine if it didn’t come with a stupid side effect: the IE construction causes some javascripts to not execute properly. SWFObject, for instance.

Luckily there is a solution. A very simple solution as it turns out. We can use conditional statements to serve the proper base tag depending on if IE or not IE. And it validates. Heck, it even works!

Conditionals! Conditionals!

The simple solution to the conundrum then, is to double our normal base tag line. Use a conditional that says “if you’re IE, read this” and another conditional that says “if you’re IE, don’t read this”. Or, in code:

<!--[if IE]><base href="http://myspliffysite.con/"></base><![endif]-->
<!--[if !IE]>--><base href="http://myspliffysite.con/" /><!--<![endif]-->

That’s All!?

Yup. That’s all. Paste those two lines (but, do change the url within the base href...) in your <head>, preferably after the <title> line, and you should be set (just make sure that you remove any other base href statement you may already have in the <head>). The code has been tested with Safari, Firefox, Opera and IE6, so far without problems. Of course, there are no guarantees. But it validates just fine.

1

rin tin tin said (5 Feb, 2008):

Had not thouhgt about this. Thanks!

HomeBlog » Talk » Solving the base href dilemma

▾ Flip Extras