I'm just finishing off a website design and as it stands at the moment I have got the CSS and markup validating with the W3C validation tool. The design looks perfect in Firefox but there is a slight problem in IE.
You can view the sight here: Test site (http://lcctest.blogspot.com);
and the CSS style sheet here: CSS sheet (http://www.leavenheathcc.co.uk/lcc_style.css).
If you view it in Firefox you will see that the title bar, left menu, content and right content DIV's all butt onto one another and within the left menu DIV the actual menu items are aligned to the right of the DIV:
http://www.leavenheathcc.co.uk/firefox.gif
However, when viewed in IE 6, there is a gap between all of the 4 major DIV's and the menu items in the left menu DIV are not against the right hand side of the DIV:
The design used to work in IE however, when 'touching it up' in order to make it validate it has started to break in IE and I don't know what the problem is.
Please can someone advise on what I can do to fix this problem?
Any speedy help will be greatly appreciated - I have been trying for quite a while to solve this but have been unable to.
Many thanks in advance,
D1n1_81
hello... i maybe wrong but i think the entire .css file is an error for i.e
for example...
html>body #banner {your stuff here}
you cannot put html>body #banner{}
instead, you can put this...
body, #banner{}
i guess the syntax alltogether is wrong?
Yes, unfortunately IE doesn't recognise a lot of the standard selectors, such as >. You'll need to use classes or select it some other way instead.