Hola amigos. Llevo tiempo echando un vistazo y no veo manera de porque pasa. En el código que pongo a continuación, el enlace de Búsqueda avanzada me visualiza una capa con slideDown, hasta ahí bien. Lo malo viene cuando descomento del código css, donde pone float:right, para posicionar una capa al lado de la otra, entonces falla. ¿que estoy haciendo mal?
Saludos.
Código PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
body { background-color: #c0d0d9; }
#contenido { background-color:#ffffff; width:960px; position:relative; margin:0 auto; text-align:center; padding: 40px 0; min-height:400px;}
#busqueda { border:1px solid #6a9695; height:67px; width:940px; margin:0 auto; position:relative;}
#busquedaAv { background-color:#cae7f5; border:1px solid #6a9695; border-top:none; height:100%; height:auto; width:940px; margin:0 auto; display:none; position:relative;}
#busquedaAv #bloque1 { width:430px; position:relative; float:left; text-align:right; padding-right:15px;}
#busquedaAv #bloque2 { width:430px; position:relative; float:right; text-align:right; padding-right:15px;}
#busquedaAv .capaInput { position:relative; /*float:right;*/ width:430px; font-size:14px; color:#000000; padding:10px 0;}
#busquedaAv .capaInput span { padding-right:12px; text-align:left; font-weight:bold;}
#busquedaAv .capaInput input{ position:relative; float:right; width:280px; height:18px; font-weight:normal; border:1px solid #7f9db9;}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#verBusqAv").click(function() {
if ($("#busquedaAv").is(":hidden")) {
$("#busquedaAv").slideDown("slow");
} else {
$("#busquedaAv").slideUp("slow");
}
});
});
</script>
</head>
<body>
<div id="contenido">
<div id="busqueda"><div id="verBusqAv"><a href="javascript:void(0)">Búsqueda Avanzada</a></div>
</div>
<div class="both"></div>
<div id="busquedaAv">
<div id="bloque1">
<div class="capaInput"><span>input1</span><input type="text" name="xxx" /></div>
<div class="capaInput"><span>input2</span><input type="text" name="xxx" /></div>
<div class="capaInput"><span>input3</span><input type="text" name="xxx" /></div>
</div>
<div id="bloque2">
<div class="capaInput"><span>input1</span><input type="text" name="xxx" /></div>
<div class="capaInput"><span>input2</span><input type="text" name="xxx" /></div>
<div class="capaInput"><span>input3</span><input type="text" name="xxx" /></div>
</div>
</div>
<div class="both"></div>
</div>
</body>
</html>