Divs overlapping

Question

그래서 ul과 li을 사용하는 대신 수평 목록을 만들려고합니다. 내가 div를 정렬하려고. 당신은 수평으로 된 div를 정렬하려면

<div class="card"> 
    <img src="img/toxiic-logo.jpg" alt="ToXiiC Avitar" style="width: 100%" /> 
    <div class="container"> 
     <h4><b>ToXiiC</b></h4> 
     <p>Founder and CTO</p> 
    </div> 
</div> 

Answer 1

, CSS-Flexbox를 사용 : 여기 JSFiddle

HTML입니다.

position: absolute; 
left: 50%; 
transform: translateX(-50%); 

이이를 수행해야
절대 위치를 CSS 형태 .card

display: flex; 
flexflow: row wrap;  /* or no-wrap instead of wrap, if you want to make 100% sure, they are all in the same row, even if they don't really fit */ 
justify-content: space-around; 

로 div에 포함 된 부모 요소를 생성하고 제거한다.