2017-01-12 2 views
0

Werfen Sie einen Blick auf dieser Test-Site zum Zentrum: https://dev.amberaviationacademy.com.au/testinstagramWie instagram Bildblock

Ich möchte die gesamten instagram Bilder zum Zentrum blockieren zu zentrieren. z.B. dies wie:

enter image description here

Auf dieser Basis: How can I center a div within another div?, was ich die set margin 0 auto für den instergram Block und set width: 90% tun müssen. Die Prozenteinstellung ist gut, wenn wir die Größe des Browsers nicht ändern. Ist es eine Möglichkeit, es automatisch zu zentrieren, auch wenn der Browser die Größe ändert?

Antwort

0

Sie müssen zwei Änderungen vornehmen: in text-align: center-.content und fügen display: inline-block;-a:

.block-instagram-block .content { 
    display: inline-block; 
    text-align: center; 
} 

a { 
    color: #222; 
    text-decoration: none; 
    display: inline-block; 
} 
+0

Können Sie uns erklären, wie es funktioniert? Bedeutet es, wenn das übergeordnete Element auf text-align center gesetzt ist, wird jeder Inline-Block zentriert? – kenpeter

+0

'text-align: center;' bewirkt, dass alle Kinder innerhalb des Elternteils zentriert sind. Die Kinderanzeige sollte als "Inline-Block" eingestellt werden, um zu verhindern, dass jedes Kind auf eine neue Zeile gesetzt wird, wenn es "Block" wäre. Also in Eltern zentrieren wir Kinder und "Inline-Block" Kinder kommen in einer Zeile die ganze Breite der Eltern füllen. – Banzay

+0

funktioniert es gut? Ich habe es versucht aber nicht funktioniert alle Bilder sind nur in der Mitte ausgerichtet! – user7357089