Div-Table-Cell을 병합 하시겠습니까?

약 4 열에 잘 작동하는 div 테이블이 있지만 지금은 항목을 확장 할 수 있도록 항목을 아래에 다른 div 나타납니다. 문제는 테이블 행 아래에 다른 div를 사용하면 너비가 첫 번째 열 너비에 갇히게된다는 것입니다.Div-Table-Cell을 병합 하시겠습니까?

내가 필요한 것은 테이블 레이아웃을 무시하는 부서입니다.이 문제에 대한 좋은 해결책이 있습니까?

출처

2012-09-06 K. D.

왜 실제 테이블을 사용하는 대신 테이블처럼 보이는 div를 사용하고 있습니까? – gotqn

이것은 표 형식의 데이터처럼 보이며 표를 사용합니다. – Kyle

왜 이렇게 평범한 테이블을 사용하지 않는지 이해하기 어렵습니다. (확실히 표 형식의 데이터처럼 보입니다). 그런 다음 테이블 레이아웃의 CSS 변환에 해당하지 않는 colspan 속성을 사용할 수 있습니다. – Faust

마지막 스패닝 div가 divTable 클래스에서 이상한 상속을받는 것처럼 보입니다. 코드에서 마지막 div는 divTable 래퍼 내에 있습니다. 내가 divTable div 밖으로 div 코드를 수정하고 모든 열을 스팬.

<div class="navContent"> 
<div id="lastRequests" class="divTable"> 
<div class="divRow bold"> 
    <div class="divCell c1"> SiteID </div> 
    <div class="divCell c2"> Ort </div> 
    <div class="divCell c3"> Anfrage </div> 
    <div class="divCell c4"> Ergebnis </div> 
    <div class="divCell c5"> Datum </div> 
</div> 
<div class="divRow"> 
    <div class="divCell c1"> 56831-12481 </div> 
    <div class="divCell c2"> gütersloh </div> 
    <div class="divCell c3"> 332312, Bielefeld, <span class="tooltip" data-tooltip="Open. Web. Business.">Deutscheland</span>, 80.32, 43.23</div> 
    <div class="divCell c4"> Proxy </div> 
    <div class="divCell c5"> 05.09.2012 20:20:21 </div> 
</div> 
</div> 
<!-- move this div here --> 
<div style="background-color: #0F9;"> 
This div should use the whole width 
</div> 
</div>

편집 :이 작동하지만, 나는 그들이 당신이 정말 대신 된 div로 테이블 기능을 복제하려고의 데이터에 대한 테이블을 사용한다 말할 때 위의 다른 사람에 동의합니다.

출처

2012-09-06 08:51:13 ThunderCat

답해 주셔서 감사합니다.하지만 그렇게하면 더 이상 실제 테이블이 없습니다 .. 난 부모 테이블을 무시해야한다는 것을 div로 말하면서 열을 병합하고 싶습니다. –

내가 볼 수 있듯이,'display : table' div에 속한 div가 자동으로 테이블의 셀이라고 가정합니다. 이 div가 부모 테이블을 무시하도록하려면 유일한 방법은 포함하는 "table"div에서 div를 제거하는 것입니다. 아니면 그냥 테이블에 붙어 :) – ThunderCat

내가 아는 한 CSS에는 colspan 속성을 사용하여 div를 표시하는 옵션이 없습니다.

실제 테이블 요소를 사용하여 실제 테이블 요소를 표시하거나 테이블 특성 및 사용자 지정 스타일을 사용하여 div를 사용하여 레이아웃을 다시 만드는 것이 좋습니다.

출처

2012-09-06 08:49:24

Div-Table-Cell을 병합 하시겠습니까?

답변

관련 문제