For IE 7 we decided to make some changes to the way the <BASE> tag is handled to bring it up to spec and at the same time fix some really odd behavior. In the process we expect some people relying on the previous behavior to have to update their content otherwise they may find their site doesn’t work exactly as planned. Most of the old functionality is still there, but there are some key differences.
To start, in previous versions of IE, you could place the BASE tag anywhere in the document. This behavior isn’t per the specification even as far back as HTML 3.2 which specifies there should only be one BASE tag per document and that the BASE tag should appear in the HEAD element. Because we allowed the BASE tag to appear anywhere it allowed you to BASE different portions of your document to different locations. Now with IE 7 we’ll be ignoring any BASE tags that appear inside of the BODY tag and we’ll only obey the first BASE tag that appears in the HEAD element. For pages that used the old behavior they may now have broken image links or anchors that don’t navigate to the proper locations. The workaround is to move the BASE tag into the HEAD tag and only have one BASE per document per the HTML 3.2 and later specifications.
The BASE element in older versions of IE was also a container element. In order to support multiple BASE elements per page and have them affect any elements following them in the tree they become descendants of the BASE element. When we need to look up and create an URL for either a link, anchor or area element we simply walk the parent chain until we find the first BASE element. This was a great shortcut, but it does have some problems. First the BASE element is now considered in CSS matching rules. So if you have any BASE elements in your document then at some point you may have to include them in your selectors for them to properly match. This would mean making special IE only rules which aren’t compliant and wouldn’t match in other browsers. Another side effect is that the BASE element when defined in the HEAD element would end up being the container for the BODY tag. This would break common rules using the child selector (>) from CSS 2.1 since HTML > BODY would simply fail to match because the document tree would contain a BASE tag between the HTML and the BODY tags. In IE 7 the BASE element no longer contains any other elements so you don’t have to worry about including it in CSS rules and it won’t show up as an element in the document tree between the HTML and BODY.
What this means for IE 7 is that we are more compliant to the HTML specifications. It also means being more compliant in the areas of CSS and selectors. And finally it means you can more reliably walk the DOM to get the information you need without having to worry about looking under BASE tags for nested child elements. In previous versions of IE the placement of the BASE tag might mean that a quick scan of all of the direct children of the HEAD element would come up a few elements short if those elements followed the BASE tag.
Supporting the new IE 7 behavior should be really simple as long as you weren’t previously relying on the use of multiple BASE tags. Basically, you’ll want to make sure any BASE tags you have appear within the HEAD element and not inside of the BODY or as part of a bare document that doesn’t contain a HEAD element. Try to include only one such tag since behavior within IE when searching for the BASE tag is only going to look for one of them. If you have more than one, then you might not get the desired behavior. If you previously wrote any CSS selectors or DOM walking code that accounted for the BASE tag you’ll find you don’t need to do that anymore and you can remove those extra rules and code (or just leave them in, they won’t match)!
- Justin Rogers