Raziel

Thank you very much!

Hi, I'm just learning CSS, and designing my first web page.It works OK in Firefox, Opera and Konqueror, but in IE 6/7, the menu is not even navigable. Just a bunch of dead pixels :)My page: http://razzziel.ra.funpic.orgThis is the part of the .css that handles the menu: /* Menu */div.menu { position: relative; float: left; width: 14em; margin-right: 1.25em; background: url(images/menu-title-bg.jpg) no-repeat left top; }div.menu a { text-decoration: none; }div.menu div.block div.content, div.menu div.block { margin: 0; padding: 0; }div.menu div.block div.title { margin: 0; position: relative; }div.menu div.block div.title * { line-height: 100%; }div.menu div.block div.title a { color: #fff; }/* http://www.phoenity.com/newtedge/element_hover/ */div.menu div.block div.title a h4:after { content: attr(title); }div.menu div.block div.title a:hover h4:after { content: attr(alt); }div.menu div.block div.title h4 { margin-left: .4em; padding: .5em .8em .6em 1.7em; color: #fff; font-weight: bold; font-size: 94%; }div.menu div.block#mf div.title h4 { height: 0; margin: 0; padding: 0; }div.menu div.block#m0 div.title { background: url(images/corner-up-right.png) no-repeat right top; }div.menu div.block#m5 div.title,div.menu div.block#mf div.title { background: url(images/corner-down-right.png) no-repeat right bottom; }div.menu div.block#m0 div.title h4 { background: url(images/m0/id.gif) no-repeat left center; }div.menu div.block#m0 div.title h4:hover { background: url(images/m0/id2.gif) no-repeat left center; }div.menu div.block#m1 div.title h4 { background: url(images/m1/1eyedalien.gif) no-repeat left center; }div.menu div.block#m1 div.title h4:hover { background: url(images/m1/1eyedalien2.gif) no-repeat left center; }div.menu div.block#m2 div.title h4 { background: url(images/m2/wolfguard.gif) no-repeat left center; }div.menu div.block#m2 div.title h4:hover { background: url(images/m2/wolfguard2.gif) no-repeat left center; }div.menu div.block#m3 div.title h4 { background: url(images/m3/imp.gif) no-repeat left center; }div.menu div.block#m3 div.title h4:hover { background: url(images/m3/imp2.gif) no-repeat left center; }div.menu div.block#m4 div.title h4 { background: url(images/m4/qdamage.gif) no-repeat left center; }div.menu div.block#m4 div.title h4:hover { background: url(images/m4/qdamage2.gif) no-repeat left center; }div.menu div.block#m5 div.title h4,div.menu div.block#m5e div.title h4 { background: url(images/m5/romero.gif) no-repeat left center; }div.menu div.block#m5 div.title h4:hover,div.menu div.block#m5e div.title h4:hover { background: url(images/m5/romero2.gif) no-repeat left center; }div.menu div.block div.content { padding: 0; margin: 0; background: url(images/menu-title-bg3.jpg) no-repeat right bottom; }div.menu div.block div.content ul { list-style: none; }div.menu div.block div.content ul { margin: 0; padding: 0; border-bottom: 1px solid #ddd; }div.menu div.block div.content ul * { line-height: 100%; }div.menu div.block div.content ul li { margin: 0; list-style-image: none; }div.menu div.block div.content ul li a { margin: 0; color: #eee; display: block; padding: .4em 2px .55em 30px; font-size: 93%; border-top: 1px solid #ddd; }div.menu div.block div.content ul li a:hover { padding: .4em 0 .55em 26px; border-left: 4px solid #ddd; border-right: 4px solid #ddd; background: url(images/credits/25w.png); } Can anyone tell me what's what IE hates in my code?I'm not really trying to make my web 100% IE compatible, but at least I wanted to make it navigable.PD: Don't be afraid of telling me if something is just done in a stupid way; I'm too noob (3 weeks learning CSS on my own) and some things are done in a too creative way.