En Firefox, Safari, Internet Explorer, Microsoft Edge, Opera trabajan perfectamente, pero en chrome, no me las detecta, lo curioso es que entro a vista de diseño adaptable en chrome y si me lo detecta, pero en el navegador como tal el chrome no me lo lee
Lo que intento es tener una capa contenedora con overflow: hidden y adentro una capa con float left y otra float right cuando la resolucion es mayor a 600, cuando la resolución es baja, la capa que era float: right se convierte en float: left, yo lo puedo resolver con una capa entre las dos capas, que use un widht:12%; y un min-width:0px y que sea display: inline-block, pero aun asi la capa de la derecha aun no se posiciona bien en chrome a diferencia de los demas navegadores
Código CSS :
@media (min-width : 300px) and (max-width : 600px) {
body{
width:300px;
}
.redonderecha{
position:absolute;
}
.CapaLogin{
position:absolute;
float:left;
margin-top:65px;
}
#AjaxCapaX{
float:left;
position:absolute;
margin-top:145px;
}
}
@media (min-width : 600px) and (max-width : 1300px) {
.redonderecha{
position:relative;
float:left;
}
.CapaLogin{
position:relative;
float:right;
}
#AjaxCapaX{
float:right;
position:relative;
margin-top:77px;
}
}
.contienecabecera{
width:98%;
overflow:hidden;
}
.redonderecha{
display:inline-block;
height:70px;
width:300px;
}
.CapaLogin{
display:inline-block;
margin-left:0px;
min-width:290px;
}
No puse todo, para no perdernos entre tanto css, pero chrome no lo detecta
y la W3C, dice que si es valido
W3C
