Hola a todos estoy trabajando con html, css y boostrap aca esta el codigo https://github.com/felipedelosh/ecomerceFuneraria y tengo el siguiente problema:
Tengo 7 elementos en un row:
<div class="mainSolutionIcons">
<div class="row">
<div class="col-1">
<div class="solutionMovil">
<img src="img/ico/movil.jpg" class="solutionIco">
<p>Movil</p>
</div>
</div>
<div class="col-1">
<div class="solutionPos">
<img src="img/ico/pos.jpg" class="solutionIco">
<p>POS</p>
</div>
</div>
<div class="col-1">
<div class="solutionEtiquetas">
<img src="img/ico/etiquetas.jpg" class="solutionIco">
<p>Etiquetas</p>
</div>
</div>
<div class="col-1">
<div class="solutionSinRevestimiento">
<img src="img/ico/sin-revestimiento.jpg" class="solutionIco">
<p>Sin revestimiento</p>
</div>
</div>
<div class="col-1">
<div class="solutionKioscos">
<img src="img/ico/kioscos.jpg" class="solutionIco">
<p>Kioscos</p>
</div>
</div>
<div class="col-1">
<div class="solutionSuministros">
<img src="img/ico/suministros.jpg" class="solutionIco">
<p>Suministros</p>
</div>
</div>
<div class="col-1">
<div class="solutionSoftware">
<img src="img/ico/software.jpg" class="solutionIco">
<p>Software</p>
</div>
</div>
</div>
</div>
Cada imagen tiene un col-1 y el problema es que no se como centrar esos elementos.
Mi pregunta es la siguiente: ->Como centrar esos elementos si son impares?
Aquí les dejo un phoshopeado de lo que quiero: