Estoy haciendo mis primeros pasos con bootstrap versión 4, supongo que no es problema de la reciente versión, y no me respeta los anchos máximos.
Quiero que los lis de una lista se dispongan en dos columnas
Aquí el código:
Código:
Los estilos:<div class="container-fluid"> <div class="row"> <img class="logo col-12" src="images/home/loveluxe_logo_hor.png"/> <ul class="col-12"> <li class="col-6"><a href="#">Home</a></li> <li class="col-6"><a href="#">About</a></li> <li class="col-6"><a href="#">Fotos</a></li> <li class="col-6"><a href="#">Artistas</a></li> <li class="col-6"><a href="#">Eventos</a></li> <li class="col-6"><a href="#">Noticias</a></li> </ul> </div> </div>
Código:
He probado a usar container. Nada.ul li{ display: inline-block; text-align: center; }
He probado usar flex-row. Nada
He probado a quitar los paddings a ul y li. Nada.
Pero cuando le pondo a los lis:
Código:
Entran a dos columnas como quiero.max-width: 49.2%
No entiendo porqué debo tocar la anchura máxima, cuando presupongo, desde mi ignorancia, que bootstrap está pensado para evitarme hacer eso.
Gracias por adelantado.