모눈 부모 아래의 전체 너비 드롭 다운

모눈 요소 아래에서 전체 너비 드롭 다운을 갖는 가장 좋은 방법은 무엇입니까? 내 그리드는 각 항목에 대해 너비가 25 %로 설정되고 항목은 플로트됩니다. 버튼을 클릭하면 하위 항목 (설명)이 상위 행 아래 펼쳐지고 다른 모눈 항목은 아래로 밀어야합니다. 이 일을하는 데 문제가 있습니다.모눈 부모 아래의 전체 너비 드롭 다운

<div class="wrapper" id="content"> 

    <div class="quarter"> 
     <div class="inner"> 
      <div class="wrap"> 
       <h5>Experiments</h5> 
      </div><!--end icon-wrap--> 
     </div><!--end inner--> 
    </div><!--end quarter--> 

    <!-- and then 30 more "quarter" instances 

</div> 

width:25%; 
float:left; 
padding:15px; 
box-sizing:border-box;

나는 각 '분기'사업부의 내부 전체 폭 인 아이를 설정 할 쉽게 수 있어요,하지만 어떻게 내가 그것을 아래 그리드의 나머지 부분을 밀어 얻을 수 있습니다 다음과 같이 내 그리드 설정 그리드를 깨뜨리지 않아? 여기

는

출처

2016-08-15 JordanBarber

https://jsfiddle.net/2j0xscjd/ 당신의 CSS 코드에

.quarter:nth-child(4n+1){clear: both;}

출처

2016-08-15 17:14:41

감사이 추가 ... 바이올린,하지만 난 단지 클릭에 표시 할 수있는 '설명'을 필요로하는이 작동하지 않습니다 ... 전체 너비 '설명'을위한 공간을 만들기 위해 클릭 할 때 '분기'요소의 높이를 늘릴 수 있지만 다른 행은 아래로 밀렸습니다. 설명보다 위치가 : – JordanBarber

위치 : 절대; 그래서 그것은 상자를 방해하지 않습니다. 분기 수요 위치 : 상대적; 상자에 대한 설명을 이동할 수 있습니다. –

그렇다면 활성 '설명'을 열 때 다른 상자를 아래로 밀어 넣는 방법은 무엇입니까? – JordanBarber

모눈 부모 아래의 전체 너비 드롭 다운

답변

관련 문제