2009-06-19 1 views
3

<td> 세트를 IE7에서 왼쪽으로 떠올리게하고 싶습니다. 창문이 너무 작 으면 다음 줄로 넘어 가야합니다.IE7 : TD 플로트 만드는 법?

CSS

table { 
    width: 100%; 
} 
td { 
    border: 1px solid red; 
} 
tr.f td { 
    width: 500px; 
    float: left; 
} 

HTML :

<table> 
    <tr class="f"> 
    <td>1</td> 
    <td>2</td> 
    <td>3</td> 
    </tr> 
</table> 

이 IE7에서 IE8과 파이어 폭스에서 작동하지만. 내가 도대체 ​​뭘 잘못하고있는 겁니까?

페이지 렌더링 모드가 "IE7 (Quirks)"또는 "IE7 (Standards)"입니다. 나는 IE8 렌더링 모드를 믿는 IE8과 함께 노력하고있다. "IE8 Compatibility View"도 실패합니다. "IE8 Standards"만 제대로 작동합니다.

답변

4

나는 이것이 가능한 방법이라고 생각하지 않습니다.

float을 td 요소 [FF/IE8]에 적용하면 [CSS 2.1 사양에 따라 익명 테이블 객체가됩니다. 본질적으로 더 이상 표 셀이 아니며 이러한 익명 객체는 표시 형식이 부동입니다.

IE7은이 부분을 따르지 않습니다. 실제로 셀의 표시 유형을 전혀 변경할 수 없으며 표시 유형이 table-cell 인 개체를 떠올리게 할 수 없습니다.

테이블 (ul/li 대신)을 사용해야하는 경우 대신 다음과 같이 할 수 있습니까?

<style type="text/css" media="screen">` 
    table { 
     width: 100%; 
    } 
    .f { 
     border: 1px solid red; 
     float: left; 
     height: 10px; 
     width: 500px; 
    } 
</style> 

<table summary="yes"> 
    <tr><td> 
    <span class="f">1</span> 
    <span class="f">2</span> 
    <span class="f">3</span> 
    </td></tr> 
</table> 
+0

나는이 결과를 예상했다. 감사합니다. IE7에서이 작업을 수행하려는 모든 시도가 실패한 이유입니다. 나는 ul/li 또는 span/div 접근 방식으로 갈 것이라고 생각한다. – Tomalak

0

가장 좋은 추측 : IE7 이하는 더 엄격한 테이블 모델을 가지고 있으며 테이블 요소의 흐름을 변경할 수 없습니다.