Wyśrodkuj wiele elementów potomnych DIV

Question

Zorientowałem się, że pomyłkę w obchodzeniu się z tym problemem.

Mam rodzica DIV i 3/więcej DIV dziecka.

Rodzic DIV jest wyrównany do środka, a podrzędny DIV powinien być unoszony w lewo, ale powinien być wyrównany do środka.

CSS zawiera

.center { 
    float:left; 
    height:250px; 
    width:15%; 
    margin: 0 auto; 
    border: 1px solid black; 
} 

I have a sample of the code link here...

Answer 1

Jeśli chcesz poziomo wyrównać swoje elementy centralnie, nie unoszą się one.

zmienić sposób ich wyświetlania do inline-block i dostosować je w centrum zmieniając text-align styl rodzica:

#parent { 
 
    text-align:center; 
 
    height:450px; 
 
    width:75%; 
 
    border:1px solid blue; 
 
} 
 
.center { 
 
    display:inline-block; 
 
    height:250px; 
 
    width:15%; 
 
    margin: 0 auto; 
 
    border: 1px solid black; 
 
}

<div id="parent"> 
 
    <div id="child1" class="center"></div><!-- 
 
--><div id="child2" class="center"></div><!-- 
 
--><div id="child3" class="center"></div> 
 
</div>

być pewny, że nie spacje lub znaki nowej linii między waszymi dziećmi <div> s (w kodzie HTML) lub skomentuj to. Teraz, gdy są to elementy w linii, ta biała przestrzeń zostanie zinterpretowana jako przestrzeń.

Answer 2

marginesy automatyczne nie będzie stosować się do elementu, który ma pływak stosowane. Usunięcie floatu powinno zacząć ...