Iniciar sesiónCerrar
Correo:
Contraseña:
Entrar
Recordar sesión en este navegador
Iniciar sesiónIniciar sesiónCrear cuentaCrear cuenta
LWP » Foros » CSS » Responsive no funciona para IOS

CSS - Responsive no funciona para IOS

Volver
Nuevo Tema
<<>>
 
Vista:
sin imagen de perfil
Val: 5
Ha disminuido su posición en 10 puestos en CSS (en relación al último mes)
Gráfica de CSS

Responsive no funciona para IOS

Publicado por Tomas (3 intervenciones) el 10/10/2019 20:01:07
Buenas, tengo un problema al momento de hacer responsive las distintas secciones de mi página web. Lo que ocurre es que no funcionan es iOS.
Utilizo media queries (@media screen and (condicion)) y aunque funciona en teléfonos con android no consigo que funcione en dispositivos con iOS.
Desde ya muchas gracias.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de joel
Val: 870
Oro
Ha mantenido su posición en CSS (en relación al último mes)
Gráfica de CSS

Responsive no funciona para IOS

Publicado por joel (252 intervenciones) el 10/10/2019 22:21:52
Hola Tomas, seria posible visualizar como lo has realizado? o indicar la url si la tienes publicada?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 5
Ha disminuido su posición en 10 puestos en CSS (en relación al último mes)
Gráfica de CSS

Responsive no funciona para IOS

Publicado por Tomas (3 intervenciones) el 11/10/2019 14:39:16
Buenas, te dejo el código del media querie. Como mencioné anteriormente, en Android funciona pero en iOS no.
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
48
49
50
51
52
53
54
55
56
57
58
@media screen and (max-width: 360px) {
  .header {
    display: flex;
    flex-direction: column;
    height: auto;}
 
  footer .footer-content {
    width: 100%;
    font-size: 0.9em;}
  footer {
    margin-top: 10%;}
  .presentacion {
    height: auto;}
  .presentacion .container .subInfo {
    text-align: center;}
  .copyright {
    font-size: 0.8em;}
  .suscripciones .suscripcion form {
    width: 100%;
    font-size: 0.5em}
  .suscripciones .suscripcion form .input {
    height: auto;}
 
    .container {
    display: inline-block;
    cursor: pointer;}
    .normalLi{
      display: none;
    }
    .bar1, .bar2, .bar3 {
    width: 35px;
    height: 5px;
    background-color: #333;

    margin: 6px 0;
    transition: 0.4s;
    }
 
    .change .bar1 {
    -webkit-transform: rotate(-45deg) translate(-9px, 6px);
    transform: rotate(-45deg) translate(-9px, 6px);
    }
 
    .change .bar2 {opacity: 0;}
 
    .change .bar3 {
    -webkit-transform: rotate(45deg) translate(-8px, -8px);
    transform: rotate(45deg) translate(-8px, -8px);
    }
    .dropdown-content{
      right: 0px;
    }
    .dropdown{
      display: none;
    }
    .dropdown-content a:hover {
      background: rgb(224, 34, 34);
    }
}
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de joel
Val: 870
Oro
Ha mantenido su posición en CSS (en relación al último mes)
Gráfica de CSS

Responsive no funciona para IOS

Publicado por joel (252 intervenciones) el 11/10/2019 19:42:23
Hola Tomas, prueba de esta manera...
1
2
/* iphone 4/5 portrait */
@media screen and (min-width: 320px) and (max-width: 359px) {

1
2
/* iphone 4 landscape*/
@media screen and (min-width: 480px) and (max-width: 567px) {

1
2
/* iphone 5 landscape */
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : landscape) {
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 5
Ha disminuido su posición en 10 puestos en CSS (en relación al último mes)
Gráfica de CSS

Responsive no funciona para IOS

Publicado por Tomas (3 intervenciones) el 12/10/2019 05:31:30
Buenas, no me ha funcionado. De todas formas, muchas gracias por su ayuda.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar