I would like to center the 2 rows in the page but aligned to the left of the container. This is the code I use:
<div class="container">
<div class="row justify-content-center menufoot">
<div class="col centeredcol">
<div class="row menurow">
<div class="col-sm-auto">
<nav>
<ul class="list-unstyled">
<li><a href="#" style="font-weight: bold">Quienes Somos</a></li>
<li><a href="#">Nuestra Historia</a></li>
<li><a href="#">Nuestros Valores</a></li>
<li><a href="#">Cifras Clave</a></li>
</ul>
</nav>
</div><!-- end col -->
<div class="col-sm-auto">
<nav>
<ul class="list-unstyled">
<li><a href="#" style="font-weight: bold">Actividades</a></li>
<li><a href="#">Químicos</a></li>
<li><a href="#">Granulados y Pulverulentos</a></li>
<li><a href="#">Transporte y Logística de Vehículos</a></li>
<li><a href="#">Estocaje de Vehículos: Campas</a></li>
<li><a href="#">Multimodal</a></li>
<li><a href="#">Servicios Asociados al Transporte</a></li>
</ul>
</nav>
</div><!-- end col -->
<div class="col-sm-auto">
<nav>
<ul class="list-unstyled">
<li><a href="#" style="font-weight: bold">Clientes</a></li>
</ul>
</nav>
</div><!-- end col -->
</div><!--End menurow -->
<div class="row copyrow">
<div class="col">
© Copyright <a href="#">Copyright</a> 2018 | <a href="#">Aviso Legal</a> | <a href="#">Política de Cookies</a>
</div>
</div><!-- End Copyrow -->
</div><!-- End centeredcol -->
</div><!-- end menufoot -->
</div><!-- end container -->
When I take out the centeredcol it centers both rows individually which is not the result i'm looking for.
