Problema float y FF

Grumete · #1 (**permalink**) 05/11/2008, 20:43

Buenas,

tengo este código:

Código:

<div class="campos">
            	<div class="nombre">Creado desde</div>
                <div class="campoP"><input type="text" name="nombre" style="width:58px;" /></div>
            	<div class="nombre"><img src="images/ic_calendar.gif" border=0 /></div>
                <div class="nombre">Creado hasta</div>
                <div class="campoP"><input type="text" name="nombre" style="width:117px;" /></div>
                <div class="nombre"><img src="images/ic_calendar.gif" border=0 /></div>
            </div>

y luego el css con

Código:

#busqueda .campos .campoP {display:table;float:left;margin-right:4px;}
#busqueda .campos .campoP INPUT {font-family:Arial, Helvetica, sans-serif;font-size:12px;color:#333333;border:0px;}
#busqueda .campos .campoP SELECT {font-family:Arial, Helvetica, sans-serif;font-size:12px;color:#333333;border:0px;}

El problema es que en FF después de cada .campoP, me hace un salto y no me respeta el float.

En IE se ve a la perfección.

¿Alguna idea en que falla mi código?

dacho · #2 (**permalink**) 06/11/2008, 05:00

Holas, El principal problema que veo es que estas definiendo el css para un id="busqueda" pero en el html no lo esta llamando.

prueba quitando #busqueda del css...

De todos modos la estructura del HTML no esta tan correcta tiene demasiados divs y creo yo que no tienen justificacion tantos. yo no pude hacer funcionar tu codigo en ninguno de los exploradores.

Por ejemplo no lograrias lo mismo con esto? (modificandolo poruqe no se que es lo que deseas hacer):

Código HTML:

<style>
.campoP {float:left;margin-right:4px; font-family:Arial, Helvetica, sans-serif;font-size:12px;color:#333333;border:0px;}
</style>

<body>
<div class="campos">
                <div class="campoP"><h4>Creado desde</h4>
				<input type="text" name="nombre" style="width:117px;" />
		               	<img src="images/ic_calendar.gif" border=0 />
		</div>

                <div class="campoP"><h4>Creado hasta</h4>
				<input type="text" name="nombre" style="width:117px;" />
		               	<img src="images/ic_calendar.gif" border=0 />
		</div>

</div>