View Full Version : Site looks WEIRD in Internet Explorer

10-25-2011, 08:20 PM

My menues won't show in Internet Explorer!

My main menues are visible, but not the submenues "Art", "Graphic" and "Illustrations" under "Work"

This is the URL of the site:

They look fine in other browsers.

Also the lists won't float (though I'm gonna try to fix that with a special stylesheet especially for IE). But I don'r know how to fix the menues that doesn't even show!

PLEASE HELP! (My deadline is friday!)

10-25-2011, 08:26 PM
I think its because you didn't close your <a> tags properly on those three links.

A quick page validation here (http://validator.w3.org) will show you what I mean.

Not sure what you mean about your lists not floating. You mean the main menu?

10-25-2011, 08:33 PM
Hello mmmm,
The menus show in IE9, if I understand what you're looking for.

Just a suggestion, instead of a 450px height on #secondcontainer, clearing the floats would let that element expand to enclose it's content. That way it would wrap around your menu images in all browsers.

Using that <br> for spacing may be causing the problem I'm seeing in IE9.

Try this instead:

/*body {
line-height: 1;
div#secondcontainer {
background-color: black;
width: 800px;
margin: 0px auto;
margin-top: 20px;
/*padding: none;
height: 450px;*/
overflow: auto;
margin-bottom: 50px;
-moz-box-shadow: 10px 10px 5px #888; /*Hittat pΠhttp://www.css3.info/preview/box-shadow/*/
-webkit-box-shadow: 10px 10px 5px #888;
box-shadow: 10px 10px 5px #888;

See this explanation of how overflow: auto; clears your floats (http://www.quirksmode.org/css/clearing.html).

10-26-2011, 12:00 PM
Thanks! I got it to work

But I still have problem with IE:

The secondcontainer positions itself very far to the right,
I don'r know what the problem is.

10-26-2011, 12:54 PM
The secondcontainer positions itself very far to the right,
I don'r know what the problem is.It's being forced right by a left-floated li#loggali element that's too tall to fit in its container element. Remove the float, shorten the float, or increase the height of its container to fix the problem.

Use the following CSS to make the problem more evident:

div#firstcontainer { overflow: auto; background-color: red; }
ul#mainmenumini { background-color: pink; }