Buenas, mi problema es que al colocar "float: left" y "width: 50%"en unos elementos para que se coloquen dentro del elemento padre en dos columnas, cuando el ancho de este padre es impar, queda una columna de 1px sin rellenar.
El código es algo así:
Código:
<div id="header">
<h5>Menu:</h5>
<ul id="menu">
<li id="columna1" >
<h4><b>Running</b></h4>
<ul id="submenu1">
<a href="" ><li>Calzado</li></a>
<a href=""><li>Camisetas</li></a>
<a href=""><li>Pantalones</li></a>
etc.
</ul>
</li>
<li id="columna2" >
<h4><b>Ciclismo</b></h4>
<ul id="submenu2">
<a href="" ><li>Bicicletas</li></a>
<a href=""><li>Recambios</li></a>
<a href=""><li>Taller</li></a>
etc.
</ul>
</li>
<li id="columna3" >
<h4><b>Fitness</b></h4>
<ul id="submenu2">
<a href="" ><li>Pesas</li></a>
<a href=""><li>Máquinas</li></a>
<a href=""><li>Entrenadores personales</li></a>
etc.
</ul>
</li>
etc.
</ul>
Los elementos en negrita son los que tienen aplicados el "float: left" y "width: 50%" y no llegan a rellenar (por un píxel) a los elementos "columnaX".
Gracias!
NOTA: En Firefox no pasa, pero sí en Safari, Opera, Chrome (IE es otro tema a parte TT).