[css]problemen in IE

[Verwijderd]

Ik heb het bij dit design omgekeerd aangemakt: design in css maken en testen in Firefox en achteraf css aanpassen voor werken in IE.

Nu heb ik twee problemen die ik niet kan oplossen:
Het menu
zo moet het:

dit gaat er fout:

HTML:

<div id="menu">
<ul>
<li>
<a href="page.aspx">Home</a></li>
<li><a href="page.aspx?page=UCSearch&amp;type=1">Tweedehandswagens</a></li>
<li><a href="page.aspx?page=UCSearch&amp;type=2">Nearly New Cars</a></li>
<li><a ref="page.aspx?page=ucmodules&amp;module=3">Openingsuren</a></li>
<li><a ref="page.aspx?page=ucmodules&amp;module=4">Geschiedenis</a></li>
<li><a href="page.aspx?page=ucmodules&amp;module=5">Plan</a></li><li>
<a href="page.aspx?page=ucmodules&amp;module=6">Nieuws</a></li>
</ul>
</div>

Cascading Stylesheet:

#menu{
position:absolute;
margin-left:-23px;

top:90px;

}
#menu ul{
/*list-style-image:url(images/opsomming.gif);*/
list-style-type:none;

}
#menu ul li{
background-image:url(images/opsomming.gif);

background-repeat:no-repeat;
font-size:12px;
color:#333333;
font-weight:bold;
padding-left:20px;

}
#menu ul li:after{
margin-left:-20px;
margin-top:4x;

margin-bottom:6px;
content:url(images/balk.gif);
display:block;
}

Geweten probleem:
IE ondersteund geen :after pseudoniem
oplossing: figuur streep mee in background zetten ?
-Wat te doen met die positionering?

zoeken form
zo moet het

dit gaat er fout

HTML:

<div id="zoeken">
        <div class="row"><span class="label">Model:</span><span class="formw">
                <select name="_ctl6:ddlModel" id="_ctl6_ddlModel">
    <option selected="selected" value="-1">Alle</option>

</select></span></div>
        <div class="row"><span class="label">Kilometerstand:</span><span class="formw">

                <select name="_ctl6:ddlKilometerstandMIN" id="_ctl6_ddlKilometerstandMIN" onchange="a()">
    <option selected="selected" value="-1">Alle</option>
    <option value="0">0</option>

</select>tot
                <select name="_ctl6:ddlKilometerstandMAX" id="_ctl6_ddlKilometerstandMAX">
    <option value="0">0</option>


</select></span></div>
        <div class="row"><span class="label">Totaalprijs:</span><span class="formw">
                <select name="_ctl6:ddlTotaalprijsMIN" id="_ctl6_ddlTotaalprijsMIN" onchange="b()">
    <option selected="selected" value="-1">Alle</option>
    <option value="0">0</option>

</select>tot
                <select name="_ctl6:ddlTotaalprijsMAX" id="_ctl6_ddlTotaalprijsMAX">
    <option value="0">0</option>

</select></span></div>
        <div class="row"><span class="formw"><a id="_ctl6_btnZoeken" href="javascript:__doPostBack('_ctl6$btnZoeken','')">Zoeken</a></span></div>
    </div>

Cascading Stylesheet:

div.row {
  clear: both;
  padding-top: 10px;
  }

span.label {
  float: left;
  width: 60px;
  text-align:left;
  color:#666666;
  }

Dus: door gebruik te maken van padding-top komt er in FF een spatie in IE is die dubbel zo groot!

Alvast bedankt voor de hulp

[Blaise]

Bij die problemen met hoogte werkt CSS' "line-height" wel stabiel cross-browser.