Avisos
Vaciar todo

Centrar botón menú desplegable en vista móvil

10 Respuestas
4 Usuarios
0 Reactions
261 Visitas
Respuestas: 11
Active Member
Topic starter
 

Hola.

Tengo instalado y activo el tema de wordpress New Zea. En la vista móvil de la página web, el botón del menú desplegable aparece fijado hacia la izquierda. Quisiera que estuviese centrado en dicha vista móvil. He revisado dicho elemento con la función de inspeccionar de Chrome y he intentado ver dónde se podía modificiar el CSS pero no sé cuál es la sintaxis que debo usar ni cómo debo proceder para obtener lo que quiero. Os adjunto una captura de pantalla.

Saludos.

URL del sitio: Contenido solo visible a usuarios registrados


 
Respondido : 25/12/2018 2:58 am
Johnny Heredia Montiel
Respuestas: 20131
Illustrious Member Moderator
 

Hola,

Puedes adjuntar la captura nuevamente para poderlo revisar?


 
Respondido : 25/12/2018 5:53 am
Respuestas: 11
Active Member
Topic starter
 

Buenos días.

Adjunto de nuevo captura de pantalla.


 
Respondido : 25/12/2018 11:32 am
Jhon
 Jhon
Respuestas: 44989
Illustrious Member Moderator
 

Hola

Tal como esta, lo puedes centrar con el siguiente código CSS, poniéndolo al final de tu archivo CSS de tu theme o mejor de tu child theme.

.menu-toggle, .main-navigation.toggled ul{
	margin:auto;
}

Sin embargo el botón se ve incluso cuando estas navegando en un ordenador, debes haber cambiado algo en CSS, alguna propiedad display, corrige esto o revierte los cambios que hayas hecho.

Saludos.


 
Respondido : 25/12/2018 4:47 pm
Respuestas: 11
Active Member
Topic starter
 

Hola.

He procedido a añadir la escritura CSS tal y cómo me has indicado pero no produce ningún efecto y el botón responsive en la vista móvil sigue ubicándose a la izquierda. He quitado el código CSS para dejarlo todo cómo estaba. Espero me podáis decir alguna otra alternativa ya que he visto en internet algunos foros en los que se habla de que la solución está en retocar el archivo comments.php junto con functions.php pero dado mi desconocimiento de la materia no me atrevo a tocar nada. Saludos.


 
Respondido : 25/12/2018 9:40 pm
Johnny Heredia Montiel
Respuestas: 20131
Illustrious Member Moderator
 

Hola,

El código proporcionado si que funciona, al parecer lo estas insertando de forma incorrecta.

Verifica si este método te es de utilidad: https://www.webempresa.com/blog/como-agregar-codigo-css-en-wordpress.html


 
Respondido : 26/12/2018 2:13 am
Respuestas: 11
Active Member
Topic starter
 

Buenos días.

Efectivamente ahora si funciona y en la vista móvil aparece el botón de menú desplegable en el centro pero surge ahora otro problema y es que en la vista normal de la web en internet sale también el botón y eso no debería ser así dado que sólo debería aparecer cuando la página adopta formato responsive para verlo a través del móvil. ¿Qué debería de hacer para solucionar este nuevo problema? Ya digo que mis conocimientos son limitados y en principio no he tocado nada que pueda afectar al comportamiento del theme que tengo instalado. Saludos.


 
Respondido : 26/12/2018 9:43 am
Pepe
 Pepe
Respuestas: 41126
Illustrious Member Admin
 

Hola Antonio.

Añade el siguiente código:

@media screen and (min-width: 37.5em) {
.menu-toggle {
    display: none;
}
}

Revisa si con ese código desaparece el botón del menú para versiones de PC y nos comentas los resultados.

Un saludo


 
Respondido : 26/12/2018 10:09 am
Respuestas: 11
Active Member
Topic starter
 

Hola. He introducido el código indicado y funciona perfectamente.

Muchísimas gracias por la atención. Cómo siempre un 10. Saludos.


 
Respondido : 26/12/2018 11:23 am
Pepe
 Pepe
Respuestas: 41126
Illustrious Member Admin
 

Hola Antonio.

Genial !!! me alegra que lo solucionaras.
Ya sabes, cualquier consulta que tengas no dudes en comunicarlo.

Cerramos el tema.

Un saludo


 
Respondido : 26/12/2018 11:26 am