Ciao.

Ho relaizzato un prototipo su un menų a tendina con icone.
Purtroppo su Firefox la disposizione č corretta, mentre su IE no.

Potete per favore aiutarmi a cpire il problema?

Questo č il codice CSS:

codice:
family:verdana, arial, helvetica, sans-serif; font-size:76%; color:#000; 
padding:0; border:0; margin:0; 
repeat-x center top; 
text-align:center;
width: 100%;
}

.containermenu {
text-align:center; 
background:#eee url(menutext.gif); 
border:1px solid #909; 
border-width:5px 1px 1px 1px; 
height:30px;
width:900px;
margin:0 0 20px 0; /* for this demo only */
}
.menuicon {
text-align:left; 
font-family: verdana, sans-serif; 
position:relative; 
font-size:0.85em; 
background:transparent; 
width:200px; 
height:30px; 
margin:0;
border:0;
padding:0;
}
.menuicon ul {
padding:0; 
margin:0; 
list-style-type: none;
}
.menuicon ul li {
float:left; 
position:relative;
padding:9px 9px 9px 9px; 
margin:8px 8px 8px 8px ;
}
.menuicon ul li.book {background:transparent url(book_go.png) no-repeat;}
.menuicon ul li.subprod {background:transparent url(webcam_delete.png) no-repeat;}


.menuicon ul li:hover a,
.menuicon ul li a:hover {
color:#c00; 
border:1px  solid;
/*padding:9px 9px 9px 9px; 
margin: 6px 0px 0px 0px; */
}

.menutext {
text-align:left; 
font-family: verdana, sans-serif; 
position:relative; 
font-size:0.85em; 
background:transparent; 
width:800px; 
height:30px; 
margin:-30px 30px ;
}
.menutext ul {
padding:0; margin:0; list-style-type: none;
}
.menutext ul li {
float:left; position:relative;
}
.menutext ul li.book {background:transparent url(book_go.png) no-repeat;}
.menutext ul li.home {background:transparent url(menu4home.gif);}
.menutext ul li.products {background:transparent url(menutextproducts.gif);}
.menutext ul li.services {background:transparent url(menutextservices.gif);}
.menutext ul li.contact {background:transparent url(menutextcontact.gif);}
.menutext ul li.site {background:transparent url(menutextsite.gif);}

.menutext ul li a, .menutext ul li a:visited {
display:block; text-decoration:none; width:70px; height:30px; color:#000; padding-left:30px; line-height:29px;
}
* html .menutext ul li a, .menutext ul li a:visited {
width:100px; w\idth:70px;
}

.menutext ul li ul {
visibility:hidden; position:absolute; top:0; left:0; height:0; overflow:hidden;
}
.menutext table {
margin:-1px; border-collapse:collapse; font-size:1em;
}

/* fist line style for IE7 and non-IE browsers and the second line for IE5.5 and IE6 */
.menutext ul li:hover a,
.menutext ul li a:hover {
color:#c00; text-decoration:underline; border:0;
}
.menutext ul li:hover ul,
.menutext ul li a:hover ul {
visibility:visible; width:170px; height:auto; position:absolute; top:30px; left:-1px; background:#fff; border:1px solid #909; overflow:visible;
}
.menutext ul li:hover ul li a,
.menutext ul li a:hover ul li a {
display:block; background:transparent; text-decoration:none; color:#c00; height:auto; line-height:1.5em; padding:5px 10px 5px 35px; width:170px; w\idth:125px;
}
.menutext ul li:hover ul li a.drop,
.menutext ul li a:hover ul li a.drop {
display:block; color:#000; height:auto; line-height:1.5em; padding:5px 10px 5px 35px; width:170px; w\idth:125px;
}
.menutext ul li:hover ul li ul,
.menutext ul li a:hover ul li a ul {
visibility:hidden; position:absolute; top:0; left:0; height:0; overflow:hidden;
}
.menutext ul li:hover ul li a:hover,
.menutext ul li a:hover ul li a:hover {
color:#00f; text-decoration:underline;
}
.menutext ul li:hover ul li:hover ul,
.menutext ul li a:hover ul li a:hover ul {
visibility:visible; position:absolute; top:0; color:#000; left:166px; height:auto; border:1px solid #909;
}
.menutext ul li:hover ul li:hover ul.left,
.menutext ul li a:hover ul li a:hover ul.left {
left:-166px;
}
.menutext ul li:hover ul li:hover ul li a,
.menutext ul li a:hover ul li a:hover ul li a {
display:block; color:#00f; height:auto; line-height:1.5em; padding:5px 10px 4px 35px; width:170px; w\idth:140px;
}
* html .menutext ul li a:hover ul li a:hover ul li a {padding:4px 10px 4px 35px;}

.menutext ul li:hover ul li:hover ul li:hover a,
.menutext ul li a:hover ul li a:hover ul li a:hover {
color:#000; text-decoration:underline;
}
Questo l'html:
codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>

<link rel="stylesheet" media="all" type="text/css" href="menu4.css" />


<title> TEST </title>
</head>
<body>
<div class="containermenu">
<div class="menuicon">
<ul>
	<li class="book"> 
	<li class="book">
	<li class="book" > 
	<li class="subprod" onclick = "alert('mao';)"> [/list]
</div>

<div class="menutext">
<ul>

	<li class="home">Home
	<li class="products">Products
	
	<ul>

		<li class="subprod">Mobiles
		<li class="subprod2">Photoframes
		<li class="subprod2">Tripods
		<li class="subprod">Memory cards
		<li class="subprod3">Cameras
		

		<ul>
			<li class="subsubl">SLRs
			<li class="subsubl">Compact
			<li class="subsubl">Digital
			<li class="subsubl">Video
		[/list]
		

		
		<li class="subprod2">Camcorders
		<li class="subprod">Accessories
	[/list]
	
	
	<li class="services">Services

	
	<ul>
		<li class="subserv4">Photography
		<li class="subserv3">Video editing
		<li class="subserv">Web site Design and Hosting
		<li class="subserv5">Reference guides
		<li class="subserv2">Tutorials

	[/list]
	
	
	<li class="contact">Contact us
	<li class="site">Site Map
	<li class="news">News
	

	<ul>
		<li class="subnews3">Breaking
		<li class="subnews">Latest
		<li class="subnews">May 2006
		<li class="subnews2">News Archives and Articles
		
		<ul class="left">

			<li class="subsubr">April 2006
			<li class="subsubr">March 2006
			<li class="subsubr">February 2006
			<li class="subsubr">January 2006
		[/list]
		
		

	[/list]
	
	[/list]
</div>
</div>
</body>
</html>
Potete trovarlo anche sul mio sito:
http://www.sspsolutions.net/TEST/MENU.HTML
(se vi serve).

Grazie mille,
ciauz!!