Technical Support Forums

Free, outstanding support from WebAssist and your colleagues

› WebAssist Forums › Design Extender › CSS Menu Writer › IE 7 and 8 compatibility

IE 7 and 8 compatibility

Thread began 5/04/2010 3:21 am by Blikbrein | Last modified 5/14/2010 9:55 pm by anonymous | 1444 views | 3 replies |

5/04/2010 3:21 am | #1 Blikbrein

IE 7 and 8 compatibility

I customized the simple menu template on the following website I took over from another designer. The site is still written in tables and I had to insert a new navigation system. The navigation text is not styled at all in IE7 and 8. IE6 still has styling as well as Safari, Chrome, etc.

Any ideas?

5/04/2010 7:27 am | #2 Jason ByrnesWebAssist

most likely your page does not have a doctype declaration before the <html> tag, this will cause IE to render using quirks mode which is not CSS compliant.

make sure your page has a doctype at line 1:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

if you are still having problems, please provide a link.

5/14/2010 9:34 pm | #3 Blikbrein

Link provided

Website can be found at www.imageandstyle.co.za

I changed the pages with the code you gave me. But still get the problem. I think it has to do with the tables that was used. On the newsletters link I merged some of the columns on the right hand side and had some success, but the menu is still placed way to the right.

5/14/2010 9:55 pm | #4 anonymous

One thing I noticed is that you have some incorrect values in your CSS page.

For example, on all of your "a" tag references it has "strong" for the font-weight property. "Strong" is typically used within HTML to designate bold strings but should not be used to define CSS. Your property should be changed to "bold" or a value based on relative structure like 100, 200, 300, etc.

This is what you currently have:

html:

a:link {
	color: #eeeeee;
	text-decoration: none;
	font-weight: strong;

}
a:visited {
	color: #eeeeee;
	text-decoration: none;
	font-weight: strong;

}
a:hover {
	color: #ff0000;
	text-decoration: none;
	font-weight: strong;

}

They should look like this:

html:

a:link {
	color: #eeeeee;
	text-decoration: none;
	font-weight: bold;

}
a:visited {
	color: #eeeeee;
	text-decoration: none;
	font-weight: bold;

}
a:hover {
	color: #ff0000;
	text-decoration: none;
	font-weight: bold;

}

Cheers,

Brian

Build websites with a little help from your friends

Your friends over here at WebAssist! These Dreamweaver extensions will assist you in building unlimited, custom websites.

Build websites from already-built web applications

These out-of-the-box solutions provide you proven, tested applications that can be up and running now. Build a store, a gallery, or a web-based email solution.