css menu - IE 7 problem

#1Izdelal sem spletno stran ter dropdown menijem spisanim v css-ju. V Firefoxu in Chrome-u špila vse lepo, IE 7 (za 6-ko ne vem) pa meni zgenerira napačno. Namesto da bi drop postavil pod gumbek ga hkrati še zamakne diagonalno desno spodaj. Poskusil sem uporabiti nek .htc fix, vendar neuspešno. Nekaj delal po tem tutorialu, ampak precej prilagodil. Slika napake je spodaj. Bil bi izjemno hvaležen, če mi kdo lahko predlaga kak drugačen fix za IE oz. kako popraviti kodo, ker me tole počasi že ubija. Spletna stran je na ogled tukaj.



Koda na spletni strani za gumbek Proizvodnja

<div class="proizvodnja">
<ul>
<li><a href="proizvodnja.html">Proizvodnja</a>
<ul>
<li><a href="izdelki.html">Izdelki</a></li>
</ul></li>
</ul>
</div>

CSS koda proizvodnje:

.proizvodnja
{
background-color: #00b0f1;
float: left;
height:26px;
width: 175px;
font-size: 16x;
font-family: arial, helvetica, sans-serif;
text-decoration:none;
color:#FFFFFF;
text-align:center;
margin-right: 3px;
padding-top:3px;
}

.proizvodnja a:link, .proizvodnja a:visited, .proizvodnja a:active /* menu at rest */
{
background-color: #00b0f1;
float: left;
height:26px;
width: 175px;
background-repeat: no-repeat;
font-size: 16px;
font-family: arial, helvetica, sans-serif;
text-decoration:none;
color:#FFFFFF;
text-align:center;
}

.proizvodnja a:hover /* menu on mouse-over */
{
float: left;
height:26px;
width: 175px;
background-repeat: no-repeat;
font-size: 16px;
font-family: arial, helvetica, sans-serif;
text-decoration:none;
color:#FFFFFF;
text-align:center;
background-image: url(images/puscica.gif);
background-position: center bottom;
}

.proizvodnja ul
{
list-style:none;
background-image: none;
background-color: #00b0f1;
margin:0;
padding:0;
float:left;
height: 26px;
width:175px; /* width of all menu boxes */ /* NOTE: For adjustable menu boxes you can comment out the above width rule.
However, you will have to add padding in the "#menh a" rule so that the menu boxes
will have space on either side of the text -- try it */
}

.proizvodnja li
{
position:relative;
min-height: 1px; /* Sophie Dennis contribution for IE7 */
vertical-align: bottom; /* Sophie Dennis contribution for IE7 */
}

.proizvodnja ul ul
{
background-color: #00b0f1;
position:absolute;
height: 26px;
z-index:500;
top:auto;
display:none;
padding: 0 0 0 0;
margin: 26px 0 0 0;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #FFFFFF;
padding-top:3px;
}

.proizvodnja ul ul ul
{
top:0;
left:100%;
}

div.proizvodnja li:hover
{
cursor:pointer;
z-index:100;
}

div.proizvodnja li:hover ul ul,
div.proizvodnja li li:hover ul ul,
div.proizvodnja li li li:hover ul ul,
div.proizvodnja li li li li:hover ul ul
{display:none;}

div.proizvodnja li:hover ul,
div.proizvodnja li li:hover ul,
div.proizvodnja li li li:hover ul,
div.proizvodnja li li li li:hover ul
{display:block;}

#2primer uporabe padajocih menujev na http://www.mayamaya.net/.

ce ti se ne be slo me pm-jni

#3hvala herbi_,
mi je precej pomagal tvoj način izdelave s topmenu in submenu. sem poskušal iz nule sam na tak način pa mi ni uspelo.

Sicer pa sedaj sploh ne potrebujem <-- If IE --> kode :) Vse kar lepo dela v Firefoxu, Chromeu in IE-ju, meni nič jasno, ampak samo da dela :)

Hvala še enkrat.

#4novejsi IE-ji naj bi delali bp, problem je z IE6, ki je pri uporabnikih se zelo prisoten ...
nekako nisem hotel tvoje kode popravljat, bolje, da najdes napako in jo odpravis sam, se posebej ob dobrem primeru :)

#5ja prej je sedmica delala probleme, sedaj nič več... na IE 6 moram pa še stestirati, ko pridem domov :) je prav fajn malo dizajnirati/kodirati s pogledom na morje :)

#6Mislim da v IE6 CSS drop down ne bo delal, problem je v hover-ju.

#7Če je dodal .htc bo delalo. Mogoče namig. Sub elemente daš leff: -2000px, da jih skriješ za ekran, ob hover pa daš leff: auto.