CSS 표 셀이 Chrome이나 FireFox에서 작동하지 않습니까?

Question

다음 코드 한 - IE에서,하지만 크롬이나 파이어 폭스에서 제대로 (이상하게) 렌더링, 참조 : 기본적으로 http://jsfiddle.net/eS34U/14/

.btn_group_fill { display:table;table-layout:fixed;width:100%; } 
.btn_group_fill .btn { display:table-cell;float:none; } 

은 "btn_group btn_group_fill"를 가진 요소해야 전체 너비 - 그것은 IE에서 -하지만 크롬이나 파이어 폭스에 있지 않습니다 - 분명히, 나는 CSS 요소 (또는 조합)가 누락되었습니다. 몇 가지 통찰력을 가진 사람이 내 오류를 발견 할 수 있다면, 나는 이것이 button 요소에 특정한 생각

감사

Answer 1

... 감사하겠습니다. 아마도 브라우저는 이들을 어떻게 표시해야하는지에 대해 다른 견해를 가지고 있습니다. 값을 span 또는 div으로 변경하면 예상대로 렌더링됩니다. 당신은 '세포'국경을 공유하려면

Example fiddle

<div class="btn_group btn_group_fill"> 
    <div type="button" class="btn btn_primary">Group Button 1</div> 
    <div type="button" class="btn btn_default">Group Button 2</div> 
    <div type="button" class="btn btn_default">Group Button 3</div> 
</div> 

또한, 경계 붕괴 속성은 여기에 유용 할 수 있습니다.

border-collapse: collapse; /* is 'separate' by default */