nooshu - Matt Hobbs' Web Development Blog

Kneeling on the shoulders of giants

IE6 and the Abbreviation tag

While testing a WordPress theme in various browsers (IE) I noticed a strange issue that was occurring in IE6, but fine in IE7+. After a little head scratching I realised IE6 doesn’t recognise the abbreviation(abbr) tag. I’d never noticed before as I very rarely use the tag.

As a quick fix you could edit your theme:

1
2
3
4
5
6
7
<!-- From -->
<abbr>Abbreviation here</abbr>
               
<!-- To -->
<abbr>
    <span>Abbreviation here</span>
</abbr>

Then apply any styles to the inner span rather than the abbr. Or if hard coding a span isn’t your thing you could always use a little bit of jQuery(1.2+) goodness to add the spans for you:

1
2
3
4
5
jQuery(function($){
    $("abbr").each(function(){
        $(this).wrapInner('<span></span>');
    });
});

The effect on page render time will be minimal since we are only grabbing a single tag with no complex selectors.

Leave a Comment

Your email will not be published. Required fields are marked *