Centrar un contenedor lleno de imágenes en CSS

votos
0

He estado tratando de centrar mi contenedor de imágenes y han intentado margin-left: auto; y margin-right: auto; en casi todo lo relacionado con las imágenes.

Básicamente, quiero que cuando se centra también de bajar la página, se mueve automáticamente algunas imágenes abajo, pero luego tengo un montón de espacio en blanco en el lado derecho de la imagen.

Aquí está mi código HTML de mi contenedor:

        <div id=sponsor-container>
            <div id=row>
              <div class=column>
                <img src=images/isc.png>
                <img src=images/kendall.png>
                <img src=images/whaley.png>
                <img src=images/drews.png>

              </div>
              <div class=column>
                <img src=images/amfam.png>
                <img src=images/body-zone.png>
                <img src=images/whitelake.png>
                <img src=images/townpump.png>

              </div> 
            </div>
        </div>

Aquí está mi css actual:

#row {
    padding: 20px 20px 20px 20px;


}

img {
    max-width: 100%;

}

.column {
    padding: 15px 15px 15px 15px;
    vertical-align: middle;

}

.column img {
    padding: 15px 15px 15px 15px;

}
Publicado el 07/11/2018 a las 22:49
fuente por usuario
En otros idiomas...                            


1 respuestas

votos
0

Cambio

vertical-align: middle;

a

text-align: center;

#row {
    padding: 20px 20px 20px 20px;


}

img {
    max-width: 100%;

}

.column {
    padding: 15px 15px 15px 15px;
    text-align: center;

}

.column img {
    padding: 15px 15px 15px 15px;

}
        <div id="sponsor-container">
            <div id="row">
              <div class="column">
                <img src="images/isc.png">
                <img src="images/kendall.png">
                <img src="images/whaley.png">
                <img src="images/drews.png">

              </div>
              <div class="column">
                <img src="images/amfam.png">
                <img src="images/body-zone.png">
                <img src="images/whitelake.png">
                <img src="images/townpump.png">

              </div> 
            </div>
        </div>

Respondida el 07/11/2018 a las 22:59
fuente por usuario

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more