div의 표 셀이 작동하지 않습니다.

Question

내 웹 사이트에서 테이블 및 표 셀을 사용하고 있습니다. 맨 왼쪽 열은 위에서부터 시작해야합니다. 대신 바닥으로갑니다. 다음은 회색 div가 맨 아래부터 시작되는 이슈에 대한 링크입니다.

http://jsfiddle.net/HtAJw/9/

Answer 1

그것은 당신이 달성하기 위해 찾고 될 것을 끝 분명하지 않다. 그러나 컨테이너 너비보다 작거나 같은 모든 요소에 픽셀 width을 추가하면 표시되는 줄 바꿈이 방지됩니다.

http://jsfiddle.net/HtAJw/10/

HTML :

<div class="parent"> 
    <div class="child"> 
     <fieldset> 
       a 
     </fieldset> 
    </div> 
    <div class="child" > 
     <div class= "newChildLeft"> 
       a <br/> b<br/> b<br/> b<br/> 
     </div> 
     <div class= "newChildRight"> 
       b<br/> b<br/> b 
     </div> 
    </div> 
</div> 

CSS :

.parent { 
    width: 100px; 
    display: table; 
    border: 1px solid green; 
    height: 100% 
} 
.child { 
    background: blue; 
    display: table-cell; 
    height: inherit; 
    width: 50px; 
} 
.newChildLeft { 
    float: left; 
    width: 25px; 
} 
.newChildRight { 
    float: right 
    width: 25px; 
} 
.child + .child { 
    background: red; 
    width: 50px; 
} 
fieldset { 
    height: 100%; 
    background-color: #666; 
    width: 50px; 
}