Hello, My layout goes crazy in IE. Border radius, positioning, etc. are extremely off. I thought it might have been because I had IE 8, but even after updating to IE 9, the CSS3 isn't working correctly. I tried using something like CSS3 PIE, but it didn't seem to change anything. I'm just not sure where to start fixing. If anyone could point me in the right direction, I would really appreciate it. My website is http://www.iscatech.com/exec/indextest.html Thank you in advance.
OK, here's the start of your web page: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta name="google-site-verification" content="" /> <title>ISCA Technologies: A Leader of Innovative Pest Management Tools and Solutions</title> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <script language="JavaScript" type="text/JavaScript"> <!-- function MM_findObj(n, d) { //v4.01 Code (markup): Then further down on line 32 we have this: </head> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1- strict.dtd"> Code (markup): So there are no less than 2 sets of head tags, and 3 doctypes. Two of those doctypes are incomplete Transitional doctypes (missing the URI), which will induce quirks mode in all versions of Internet Explorer. Also, there are 3 html tags (but only 1 closing html tag). Seems like Dreamweaver might be causing some of your misery there, plus it looks like a whole template page has more or less been inserted into an existing page. You need 1 set of html tags, 1 set of head tags, and 1 complete doctype. So you'll need to fix those main problems up, plus find and fix other problems, with the help of the validator: http://validator.w3.org/ For more on doctypes, see: http://alistapart.com/articles/doctype
As filmfiddler pointed out, you have a lot of invalid markup -- the multiple doctypes just being the start of the issues. I'm just going to go down the list of what I see wrong: Multiple doctypes/head structures (already covered) Transitional document -- tranny is for supporting old/outdated/half-assed coding methods, NOT building new websites. MM_ javascript nonsense -- a hallmark of building with Adobe/Macromedia products, a complete waste of code that is basically using javascript to do CSS' job. RIDICULOUS number of containers for the heading, presentational images in the markup, nonsensical use of heading tags. The first H2 in particular makes no sense since it's NOT a heading -- a heading being content that marks the start of a subsection of the page. De-emphasized banner-type taglines are NOT headings. DIV around the menu for no reason, attributes like TARGET that have no business being used in a modern document, absolute URL's on everything for no good reason other than to waste bandwidth, and endless/pointless classes doing inheritance's job. Use of H3's for H2 level elements makes no sense, since I'm pretty sure none of those are subsections of the welcome text. clearfix nonsense like it's still 2001. HTML 3.2 style code in modern documents. EMphasis around elements that should not be emphasized... Line breaks doing padding or margin's job... paragraphs around non-paragraph elements, etc, etc... ... and that's just the markup -- that's before talking the goofy image rotator that forces you into a fixed width layout, and other accessibility failings like the undersized fixed metric (aka px) fonts with a serif font... and the complete lack of scripting off graceful degradation of content. I would suggest throwing it all away and starting over with MODERN markup techniques... staying away from the "gee ain't it neat" javascripted nonsense and with an eye towards accessibility and cross-browser design "from the start".
Sorry to tell you that but I recommend you to look at some essential tutorials for HTML and CSS and redesign your code from scratch cause this is...sorry for being honest a lot of HTML trash. But don't give up, you'll learn