Saludos.
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:
<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>
Los estilos:
Código:
ul li{
display: inline-block;
text-align: center;
}
He probado a usar container. Nada.
He probado usar flex-row. Nada
He probado a quitar los paddings a ul y li. Nada.
Pero cuando le pondo a los lis:
Entran a dos columnas como quiero.
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.