Fixing the double-margin bug (in Internet Explorer) in Joomla!
Internet Explorer is a very popular browser, but can often cause headaches for template designers due to its prevalence with the commonly used float-based layouts. A common bug is known as the "double-margin" bug.
Getting ready
We can use conditional comments to create a stylesheet that affects Internet Explorer only by linking a stylesheet within a conditional comment in the<head>
element of your template's index.php
file:
<!--[if lte IE 7]> <link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/css/ieonly.css" rel="stylesheet" type="text/css" /> <![endif]-->
As these bugs affect versions 7 and earlier of Internet Explorer, you can safely target those of the browser only. You need to add this new style into the ieonly.css
file in your template's \css
directory.
How to do it...
As we saw earlier, there are a number of common bugs in Internet Explorer.