Responsve ul 목록. 어떻게 접근합니까?

Question

여기에 어떻게이 열이 완전히 반응해야합니까 내가 Demo

작업을하고있는 바이올린 수 있도록 화면 크기가 나는 모든 요소가 서로 아래 스태킹보다 인라인 않고 있고 싶어 이하가 될 때.

해결 방법? 여기

는 CSS 내 바이올린을 확인하시기 바랍니다에 대한 샘플 마크 업

<div id="apologies-list"> 
       <ul id="apologies-list-content"> 
        <li><a tabindex="-1" href="#"> 
         <div class="user-avatar list-padding span12 clearfix" > 
          <div class="span1"> 
          <input class="case" name="case" type="checkbox" value=""> 
          </div> 
          <div class="span2"> 
          <img id="list-avatar" src="http://placehold.it/60x60" alt="" /> 
          </div> 
          <div class="span6"> 
          <span>Apologies initials</span> 
          <small>January 31, 2009 9:18 am</small> 
          </div> 
          <div class="span3 "> 
          <span class="badge badge-info custom-badge">2</span> 
          <i class="icon-trash"></i> 
          </div> 
         </div> 
         </a> 
        </li> 
</ul> 
</div> 

입니다.

Answer 1

CSS를 사용 미디어는 왜 여전히 BS2를 사용하는

 

    @media screen and (max-width:400px) 
    { 
    #apologies-list-content li div {display:inline-block} 
    }