Missing stylesheets/scripts/images when using BASE element for a local html file rendered in IE8 in IE8 standards mode

Question

We have some HTML pages (local, not on a web server) that use the BASE element to identify a specific base directory that contains a bunch of common stylesheets and images.

Answer 1

Status Update:   Use:

Here's the process I used in creating this solution to allow IE8 to use the Base Attribute for local files.

To clarify: This W3C validated solution works for IE7, IE8 and all modern browsers!

Reference Screenshot::
Here you can see that IE8 Address Bar does not operate like the other modern browsers: The slashes are reversed and there is no file:/// protocol seen. However, IE8 will show the file:/// protocol in the Browser's Status Bar upon page refresh!

Reference Screenshot:
Since IE8 is treating Local Files differently, understanding the IE8 protocol for file:/// is important.

To realize what syntax methods are available, viewing Internet Options (Security Tab) for Local Intranet will give us that info. No changes are actually done here, just the syntax please:

In the above photo, the Local Intranet Window confirms that backslashes are required.

Also, it shows that the file:\\ protocol is associated with this slash syntax. Since file:/// protocol is implied automatically by IE8 (previously mentioned: see Browser's Status Bar and note slashes are rendered correct!!).

Defining this file: protocol in the Base tag is the issue. The solution is not to use a protocol!

Reference Link 1: Protocol-less URL Scheme:

It’s not exactly light reading, but section 4.2 of RFC 3986 provides for fully qualified URLs that omit protocol (the HTTP or HTTPS) altogether. When a URL’s protocol is omitted, the browser uses the underlying document’s protocol instead.

Reference Link 2: Understanding Network Path Reference by Paul Irish:

*Of course, if you're viewing the file locally, it'll try to request the file with the file:// protocol.

The references above explain that using // will allow any browser to use the currently known URL Scheme when accessing files or assets. Since IE8 is the game changer, using \\ instead of // will work for the Base tag since all browsers will convert/interpret that as the standard file:/// URL Scheme (local files implied), including browser IE7!

Complete HTML Markup | The working DEMO: