Centrar menu horizontal superior

[Pelleque]

Buenas, tengo un pequeño descuadre que no sé como puedo cambiarlo, no encuentro la parte del código donde hacerlo.

Me gustaría que las categorías estuviesen alineadas verticalmente, es decir, en el centro. También me gustaría reducir un poco esa franja blanca.

Muchas gracias, espero vuestra respuesta.

 

[Adrian]

Pon un width:0px para que te salga verticalmente. Para la franja blanca quitale tamaño al height y ponlo a tu gusto.

[Pelleque]

1 hour ago, Adrian said:

Pon un width:0px para que te salga verticalmente. Para la franja blanca quitale tamaño al height y ponlo a tu gusto.

Todo eso donde? En qué archivo y linea?

[Adrian]

En el archivo custom.css lo metes todo. No hace falta que lo metas en ningúna linea especifica.

[Pelleque]

2 hours ago, Adrian said:

En el archivo custom.css lo metes todo. No hace falta que lo metas en ningúna linea especifica.

.row {
	width: 0px;
}

Vale, lo he puesto así y se va todo a la mierda, no lo quiero vertical, quería el menú horizontal pero que estuviera alineado verticalmente, es decir, centrado en la franja blanca.

Edited March 8, 2019 by Pelleque (see edit history)

[Adrian]

Puedes pasarme la pagina y te indico exactamente como ponerlo?

[Pelleque]

2 hours ago, Adrian said:

Puedes pasarme la pagina y te indico exactamente como ponerlo?

http://s773038918.mialojamiento.es/

De momento en este dominio hasta que la ponga bien.

[Pelleque]

On 3/8/2019 at 3:37 PM, Adrian said:

Puedes pasarme la pagina y te indico exactamente como ponerlo?

¿Encotraste la manera?

[Adrian]

Hola, pon:

 

.top-menu{

margin-top: 7%;

}

 

No se si es lo que buscas

Edited March 11, 2019 by Adrian (see edit history)

[Pelleque]

2 hours ago, Adrian said:

Hola, pon:

 

.top-menu{

margin-top: 7%;

}

 

No se si es lo que buscas

Tengo esto:

 

Y quiero esto (Editado con paint)

 

Con un pequeño cambio en lo que me has dicho se me queda asi;

#header .header-top .position-static {
	position: static;
	margin-top: 15px;
	text-align: center;
}

 

La barra de busqueda está un poco mas para arriba que las letras y las letras me gustarían que estuviesen un poco más separadas. ¿Es posible?

Muchísimas gracias por tu ayuda

[Pelleque]

Vale, he conseguido editar la caja de busqueda y ponerle margen superior tambien, voy aprendiendo. Solo me falta que las letras se separen más, que se queden equidistantes

Edited March 11, 2019 by Pelleque (see edit history)

[Adrian]

#header .header-top a[data-depth="0"]{

padding-right: 39%;

margin-left: -40%;

}

Si lo pones de esa forma te quedará como indicas pero perderás todo el responsive para tamaños moviles y tablets. Quizás hay una forma más fácil pero no tengo ni idea.

[Adrian]

Por cierto, he visto que has puesto el margen a la caja con px. Ponlo siempre con % o em para temas de responsive.

[Pelleque]

2 hours ago, Adrian said:

Por cierto, he visto que has puesto el margen a la caja con px. Ponlo siempre con % o em para temas de responsive.

Que significa em?

[Pelleque]

2 hours ago, Adrian said:

#header .header-top a[data-depth="0"]{

padding-right: 39%;

margin-left: -40%;

}

Si lo pones de esa forma te quedará como indicas pero perderás todo el responsive para tamaños moviles y tablets. Quizás hay una forma más fácil pero no tengo ni idea.

He conseguido que me quede mas o menos bien:

 

Quitando el padding del .top-menu a[data-depth="0"]

Lo que quiero hacer ahora es poner esta caja cuadrada, es decir, de 88*88 o algo similar, para que no se coma parte de las categorías. No la encuentro por ningún lado. ¿Está tambien en theme.css?

 

 

Edited March 11, 2019 by Pelleque (see edit history)

[Adrian]

Si, ahi está todo. Pero te recomiendo que lo cambies en custom.css que es el editor de css para que cuando haya futuras actualizaciones no pierdas lo escrito.

[Pelleque]

Just now, Adrian said:

Si, ahi está todo. Pero te recomiendo que lo cambies en custom.css que es el editor de css para que cuando haya futuras actualizaciones no pierdas lo escrito.

Ya he cambiado varias cosas del theme.css, las tengo apuntadas todas por si acaso, ¿si las escribo en el custom.css irá todo bien? ¿El codigo no entra en conflicto o algo?

[Adrian]

No entra en conflicto. Simplemente añadele !important para que tu codigo tenga validez sobre el theme.css. Ej:

prueba{

text-align: center !important;

}

[El Reino]

 

On 3/11/2019 at 11:16 AM, Adrian said:

#header .header-top a[data-depth="0"]{

padding-right: 39%;

margin-left: -40%;

}

Si lo pones de esa forma te quedará como indicas pero perderás todo el responsive para tamaños moviles y tablets. Quizás hay una forma más fácil pero no tengo ni idea.

Hola! quiero hacer algo parecido a Pelleque, pero leyendo todo el hilo he visto que Adrián comentaba que al modificar se perdería el responsive de la plantilla. Mi pregunta es: ¿No puedo modificar la altura del menú sin perder el responsive de la plantilla?

Muchas gracias y espero que podáis disculparme, no controlo mucho el tema...

[Adrian]

Hola! Si modificas un poco no pasa nada. Es decir, si pasas de 20px de altura a 40px tampoco te vas a morir. Intentalo y nos dices.

[Alba93]

Buenas tardes,

Me gustaría centrar el menú principal y que quedara justo debajo del logo (que lo tengo en el centro). Adjunto imagen.

El menú me sale debajo a la izquierda, y lo quiero debajo centrado. ¿Alguien sabe decirme que texto tengo que modificar? 

Mil gracias!

Edited February 22, 2021 by Alba93 (see edit history)