Menu marcas en vertical ¿como cambiarlo? [SOLUCIONADO]

[Manuelmoreno]

Hola en mi web el menu de marcas sale de una manera muy poco estetica y no encuentro como poder modificar esto.

gracias

Prestashop 1.7.5.1

www.boxingfactory.es

Adjunto captura

 

Edited December 13, 2019 by Manuelmoreno (see edit history)

[Prestafan33]

Mira a ver si te sirve esto que comentamos aquí:

 

[Manuelmoreno]

Donde tengo que ponerlo, este es mi archivo custom.css

/*
 * Custom code goes here.
 * A template should always ship with an empty custom.css
 */
@media (max-width: 767px) {

#header .header-nav .top-logo a img {
max-height: 200px;
}
#header .header-nav {
max-height: 225px;
}
}

 

[Prestafan33]

Al final del todo por ejemplo.

[Manuelmoreno]

Se ve ahora asi voy a borrar todas las descripciones a ver si asi se colocan, las 3 primeras si se han ordenado.

Sobre esto, en chrome si se ha ordenado y en firefox no, es normal? ya borre la cache por si era eso pero nada

 

[Sergi]

Hola Manuel,

De un vistazo veo que has conseguido lo que querias. ¿Es así? Veo también que no sale el mismo número de marcas en todas las filas cuando se visualiza en pantallas anchas (como en un PC). Te aconsejo que añadas en la siguiente regla:

@media (min-width:800px){
#manufacturer li.brand {
    max-width: 25%;
}}

Por ejemplo, o que acudas a un profesional del diseño, que podrá aconsejarte en este y en más temas con soluciones inlcuso mejores que esta.

Saludos y suerte con la web 👍

[Manuelmoreno]

Hola @Sergi si parece que lo habia conseguido pero, tras añadir las lineas que me comentas al final del css el menu ha vuelto a ponerse de forma vertical como al principio he borrado cache y sigue igual. He quitado las lineas que me dijiste y ahora se vuelve a quedar en vertical.

No entiendo porque

Gracias

[Sergi]

Buenas,

Yo lo veo como antes (imagen adjunta). Lo que comentas no tiene lógica, algun paso hay ahi de más o de menos para que te suceda. Añadiste las líneas en custom.css? Qué hiciste luego?

De todas maneras, reitero mi consejo de acudir a un diseñador profesional (si es desarrollador tanto mejor) con experiencia en Prestashop. Vale la pena.

 

 

Saludos

Edited December 12, 2019 by Sergi (see edit history)

[Prestafan33]

Prueba esto (ojo, que ya tienes una de las reglas creadas, eliminar la anterior y pon esta):

#manufacturer li.brand {
	display: flex;
	flex-direction: column;
	padding: 15px;
	text-align: center;
	width: 270px;
	border: 1px solid #bbb;
	margin: 2px;
}
#manufacturer #main > ul {
	display: flex;
	flex-wrap: wrap;
}
#manufacturer .brand-infos {
  	margin-top: 10px;
}
#manufacturer .brand .brand-products {
  	margin-top: auto;
}
#manufacturer .brand-products > a:first-of-type {
	float: left;
}
#manufacturer .brand-products > a:last-of-type {
  	float: right;
}

Aún se puede mejorar bastante, pero es un comienzo.

Edited December 12, 2019 by Prestafan33 (see edit history)

[Manuelmoreno]

Ya lo he puesto muchisimas gracias queda muchisimo mejor y he analizado lo que me has puesto y me ha servido para aprender un poco mas sobre css.

Muchisimas muchisimas Gracias!!