Chrome no me detecta media queries
Publicado por Augusto (1 intervención) el 07/07/2016 17:57:11
Hola
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 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 como lo hace en los demas navegadores
No puse todo, para no perdernos entre tanto css, pero chrome no lo detecta
y la W3C, dice que si es valido
http://www.w3schools.com/cssref/css3_pr_mediaquery.asp
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 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 como lo hace en los demas navegadores
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
@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
http://www.w3schools.com/cssref/css3_pr_mediaquery.asp
Valora esta pregunta
0
