Alinear DIV horizontalmente

Al intentar centrar DIV horizontalmente dentro de un contenedor DIV, es posible que encuentre problemas de alineación. Esto puede ocurrir por varias razones. Para rectificar el problema, considere la siguiente solución:

Usar visualización de bloque en línea en lugar de flotante

En lugar de utilizar la propiedad flotante, considere emplear la visualización: inline- atributo de bloque. Esto garantizará que los DIV se muestren como elementos en línea, lo que permitirá la alineación horizontal.

Código actualizado

Para implementar esta solución, modifique su código CSS de la siguiente manera:

.row {
  width: 100%;
  margin: 0 auto;
}
.block {
  width: 100px;
  display: inline-block;
}

Este ajuste rectificará el problema de alineación horizontal, permitiendo que los DIV se coloquen centralmente dentro del contenedor. Vale la pena señalar que este enfoque es particularmente adecuado para escenarios donde el ancho de los DIV es fijo o relativamente similar.