Hello, Wondering if you guys could have a look at my site: http://hiphopkaraokeessex.com/ I am having trouble with the CSS and the page is not displaying proplerly when tested in IE 6, 7 & 8. Any feedback on what my be causing this would help greatly. Thank you.
You can start by fixing all the markup errors. There are seven of them, plus one warning. Head over to the W3 Validator and check 'em out. One of the errors is quite serious. There's a line of code above your doctype. The doctype must go at the very top. There can't be anything above it. Fix that and the other errors and see what happens. If the problems with IE still show up, someone could just have a quick glance at your markup.
Thanks for the advice. Just ran through the validation checker and the only error messages seem to be related to a lightbox stylesheet. But this wouldn't effect how my page is currently displaying. Could it have something to do with the box model? Because the main problem seems to be that my central column is appearing too wide in IE and forcing my sidebar on the right to drop down beneith the left and center column... EDIT: I seem to have fixed the problem with the colum dropping down, this was due to a width set in the flash element on the twitter widget. Changed it and it now looks ok. The only problem I am having now that I can't understand is that my social icons are not in the correct possition and my home page is not centred. This is strange as all of the other pages on the site are actually displaying fine and they all use the same stylesheet.
Did you run your HTML through the validator? Masterful did mean your HTML and not your CSS (though it's nice to run the css through too). [b]<meta name="keywords" content="hiphop hip hop karaoke essex southend essex sunrooms england south east open mic DJ night" />[/b] <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head profile="http://gmpg.org/xfn/11"> <title>HipHop Karaoke Essex</title> <script type="text/javascript" src="wp-content/themes/HipHop/js/prototype.js"></script> <script type="text/javascript" src="wp-content/themes/HipHop/js/scriptaculous.js?load=effects,builder"></script> <script type="text/javascript" src="wp-content/themes/HipHop/js/lightbox.js"></script> <!--[if lt IE 7]> <script src="wp-content/themes/HipHop/ie7/IE7.js" type="text/javascript"></script> <script src="wp-content/themes/HipHop/ie7/ie7-squish.js" type="text/javascript"></script> <![endif]--> Code (markup): This freax the validator out: http://validator.w3.org/check?uri=h...(detect+automatically)&doctype=Inline&group=0 (usually removing a single error removes a bunch of other errors though... I'll bet moving that meta tag down over by the other meta tags would fix a lot of them... the validator says it can't determine a parse mode but you do have a doctype. I think the stuff before it is just screwing with its mind) ...and btw this also just happens to screw with IE's mind too. IE goes into Quirks Mode, meaning it sees something that's not a doctype at the very top of your page, and thinks, hey there's no doctype, this page must have been written back in the 90's or something, and proceeds to render the page like IE5.5 does. Ew. I'll bet IE7 and 8 will get very nice very quickly after moving that meta tag at the top. Do a View Source when looking at your page in a browser, and you'll see it right away. btw as an unrelated thing, I see your quote marks in your code: “Golden Age Of Hip Hop†and I wonder, what editor are you typing those in? I mean, it's not some Windows thing like Word is it? Since I noticed you stated utf-8 as your charset in your meta tag. Windows programs (unless you change their settings) are notorious for screwing with utf because they use a special windows-only charset (1251, 1252) which on some characters match regular utf-8 or latin1 but with other characters (famously the "smart quotes" you get in stuff like Word) the characters used in windows are non-valid or control characters in real-word charsets. So some program trying to read Windows output as utf-8 can barf on things like the smart quotes. Maybe you are able to type those curly quotes directly from your keyboard though, I dunno. I can't.
Thank you very much for your reply Stomme poes. I am using Dreamweaver CS4. I moved the meta tags down and now the page displays fine in all versions of IE except version 7, where the 3 main columns are not dropping down below the nav bar instead they are overlapping it. I really appreciate all you help.