Saludos, estoy con un problema en el menu de mi sitio web. Resulta que tengo puesta una imagen en la cabecera del menu que tendria que ir pegada a la parte inferior del menu superior. En firefox se ve perfecto pero en Safari y en Internet explorer se ve un espacio en blanco que no consigo quitar de ningun manera. He probado a tocar los paddings, margins, etc. pero no hay manera. Lo mejor de todo es que tengo otro menu justo debajo que hace exactamente lo mismo y funciona perfectamente.
El sitio web es el siguiente (
aviso que contiene alto contenido erotico):
hellosexlife .com/web/main.php
y el codigo fuente del CSS es este:
Código:
#menu{
margin: 0px;
width: 250px;
float: right;
padding: 0px 0px 0px 0px;
background-color: #ffffff;
position: relative;
}
#cuerpo{
/*width: 550px;*/
width: 510px;
float: left;
margin: 0px;
padding: 0px;
}
#searchContent{
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
text-align: center;
}
#searchContent h3{
background: transparent url(img/menu/menu3_03.jpg) no-repeat;
width: 250px;
height: 43px;
margin: 0px 0px 0px 0px;
/*border-bottom: #352aed solid 1px;*/
}
#searchContent h3 span{
display: none;
}
#searchContent ul{
width: 250px;
height: 150px;
margin: 0px;
padding: 0px;
background: url(img/button_off6.jpg) repeat-y;
}
#searchContent li{
margin: 0px;
/*background: transparent url(img/button_off6.jpg) no-repeat top left;*/
list-style-type: none;
padding: 0px 0px 0px 0px;
}
#sextionsContent{
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}
#sextionsContent h3{
background: transparent url(img/menu/menu3_06.jpg) no-repeat;
top: 429px;
width: 250px;
height: 125px;
margin: 0px 0px 0px 0px;
/*border-top: #352aed solid 1px;
border-bottom: #e53131 solid 1px;*/
}
#sextionsContent h3 span{
display: none;
}
#sextionsContent ul{
width: 250px;
margin: 0px;
padding: 0px;
background: url(img/button_off4.jpg) repeat-y;
}
#sextionsContent li{
margin: 0px;
padding: 0px;
/*background: transparent url(img/button_off4.jpg) no-repeat top left;*/
/*border-bottom-width: 1px;
border-bottom-color: #5b54ff;
border-bottom-style: dotted;*/
list-style-type: none;
}
#sextionsContent a:hover{
text-decoration: underline;
}
#areasContent h3{
background: transparent url(img/menu/menu3_08.jpg) no-repeat;
width: 250px;
height: 153px;
margin: 0px 0px 0px 0px;
}
#areasContent h3 span{
display: none;
}
#areasContent ul{
width: 250px;
margin: 0px;
padding: 0px;
/*background: transparent url(img/menu/menu3_10.jpg) no-repeat bottom left;*/
background: url(img/button_off8.jpg) repeat-y;
}
#areasContent li{
display: block;
padding: 0px;
margin: 0px;
/*background: transparent url(img/button_off8.jpg) repeat-y top left;*/
list-style-type: none;
}
#areasContent a:hover{
text-decoration: underline;
}
El codigo HTML que controla el menu es el siguiente:
Código HTML:
<div id="menu">
<!--<div id="search"></div> -->
<div id="searchContent">
<form action="main.php?q=search" method="post" accept-charset="utf-8">
<h3><span>Search Women</span></h3>
<ul>
<li>
<span class="a1">Find a Woman in:</span>
</li>
<li>
<select name="area">
<option value="london">London</option>
<option value="yorkshire">Yorkshire</option>
<option value="humberside">Humberside</option>
<option value="cumbria">Cumbria</option>
<option value="s_england">South Eng.</option>
<option value="nw_england">North-West Eng.</option>
<option value="lancashire">Lancashire</option>
<option value="e_mids">East Mids</option>
<option value="ni">Northern Ireland</option>
<option value="e_england">East Eng.</option>
<option value="ne_england">North-East Eng.</option>
<option value="scotland">Scotland</option>
<option value="se_england">South-East Eng.</option>
<option value="w_mids">West Mids</option>
<option value="wales">Wales</option>
<option value="sw_england">South-West Eng.</option>
</select>
</li>
<li>
<span class="a1">With Age :</span>
</li>
<li>
<select name="age">
<option value="all">All</option>
<option value="teen">18-19</option>
<option value="tweenties">20-29</option>
<option value="thirties">30-39</option>
<option value="forties">40-49</option>
<option value="older">50></option>
</select>
<br />
<input type="submit" value="Continue →">
</li>
</ul>
</form>
</div>
<!-- <div id="sextions"></div> -->
<div id="sextionsContent">
<h3><span>Other Sextions</span></h3>
<ul>
<li><span class="a0">Yes To Older Men</span></li>
<li><span class="a0">Yes To Married Men</span></li>
<li><span class="a0">EasyBrits Hot Sex Parties</span></li>
<li><span class="a0">Selection of Older Women</span></li>
<li><span class="a0">Our Best Dominatrix</span></li>
</ul>
</div>
<!-- <div id="areas"></div> -->
<div id="areasContent">
<h3><span>Choose area</span></h3>
<ul>
<li><span class="a0"><a href="main.php?q=london">London</a></span></li>
<li><span class="a0"><a href="main.php?q=yorkshire">Yorkshire</a></span></li>
<li><span class="a0"><a href="main.php?q=cumbria">Cumbria</a></span></li>
<li><span class="a0"><a href="main.php?q=scotland">Scotland</a></span></li>
<li><span class="a0"><a href="main.php?q=wales">Wales</a></span></li>
<li><span class="a0"><a href="main.php?q=lancashire">Lancashire</a></span></li>
<li><span class="a0"><a href="main.php?q=ni">Northern Ireland</a></span></li>
<li><span class="a0"><a href="main.php?q=ne_england">North East England</a></span></li>
<li><span class="a0"><a href="main.php?q=nw_england">North West England</a></span></li>
<li><span class="a0"><a href="main.php?q=e_mids">East Midlands</a></span></li>
<li><span class="a0"><a href="main.php?q=w_mids">West Midlands</a></span></li>
<li><span class="a0"><a href="main.php?q=s_england">South England</a></span></li>
<li><span class="a0"><a href="main.php?q=se_england">South East England</a></span></li>
<li><span class="a0"><a href="main.php?q=sw_england">South West England</a></span></li>
<li><span class="a0"><a href="main.php?q=e_england">East England</a></span></li>
<li> </li>
</ul>
</div>
</div>
Me parece que es problema del formulario pero no he conseguido dar con la solucion...