Buenas,
tengo configurada la pag para que la parte superior comience con un slider, sin parte de la fila pero manteniendo el logo de cabecera. Quisiera hacer lo mismo para la versión móvil. Ya tengo el header transparente, pero se visualiza la fila. ¿cómo podría eliminar esa parte de la fila para que se vea como en la versión PC?
Adjunto imaginen para que vean de forma más clara lo que se pretende. Uso Chrome para las visualizaciones.
gracias
URL del sitio: Contenido solo visible a usuarios registrados
Hola
Puedes probar usando el siguiente código CSS
@media ( max-width:978px){ .q_logo { top: 50%; left: 0; } .header_bottom .container_inner{ height:0; float:right; } }
Puedes agregar este código al final de tu archivo style.css de tu child-theme
Saludos.
Hola
Prueba agregando el siguiente código adicional al código anterior
@media ( max-width:480px){ .q_logo { left: -120%; } }
Saludos.
Hola,
gracias por el código; retocándolo un poco más o menos he conseguido lo que pretendía. Aunque para ponerlo un tanto más pequeño el logo en versión móvil trato de hacerlo y no lo consigo. Os paso dos códigos. Uno que funciona pero con logo demasiado grande para móvil (A) y otro intentándolo escalar (B)
CÓDIGO A
@media ( max-width:978px){
.header_bottom .container_inner{
height:0;
float:right;
}
}
@media ( max-width:480px){
.q_logo {
left: -100%;
}
}
CÓDIGO B
@media ( max-width:978px){
.header_bottom .container_inner{
height:0;
float:right;
}
}
@media ( max-width:480px){
.q_logo {
width: -50% !important;
left: -100%;
}
}
Hola Juan Manuel.
Prueba con lo siguiente:
@media only screen and (max-width: 480px) {
header .q_logo img.mobile {
width: 25%!important;
height: auto!important;
}
}
Un saludo
Buenas,
>poniendo ese código + el código para 978px ,"eliminas" el logo.
>poniendo ese código sólo, lo escalas pero mantienes la fila que no se desea.
>poniendo el codigo de la Captura 1, todo estaría perfecto salvo por el tamaño no deseado del logo en versión móvil.
muchas gracias
Hola Juan Manuel
Veo que se redimensiona bien:
Otra cosa es que tengas otros códigos que lo escondan con alguna resolución por ejemplo veo que tienes movido el logo
.q_logo {
left: -120%;
}
Estas cosas pueden hacer que el logo se desplace tanto que no sea visible en algunas resoluciones.
No es bueno hacer tantos cambios ya que un codigo puede servir para algo en concreto pero también afectan a otros sitios/resoluciones.
Un saludo
Hola
Lamentablemente no es posible de forma simple y siempre terminarás usando CSS, ya que la estructura que se genera no esta pensada para ese diseño en móvil
Te sugiero consultar con el desarrollador del theme tal vez tenga alguna actualización o mejora
Saludos.