1. ホーム
  2. html

[解決済み] 表示がtable-cellに設定されている要素のcolspan/rowspan

2022-07-07 12:11:21

質問

次のようなコードがあります。

<div class="table">
    <div class="row">
        <div class="cell">Cell</div>
        <div class="cell">Cell</div>
    </div>
    <div class="row">
        <div class="cell colspan2">Cell</div>
    </div>
</div>

<style>
    .table {
        display: table;
    }
    .row {
        display: table-row;
    }
    .cell {
        display: table-cell;
    }
    .colspan2 {
        /* What to do here? */
    }
</style>

かなり分かりやすいですね。の要素にcolspan(またはcolspanに相当するもの)を追加するにはどうしたらよいでしょうか? display: table-cell ?

どのように解決するのですか?

私の知る限り、colspan/rowspan がないのは、単に display:table . この投稿を参照してください。

http://www.onenaught.com/posts/201/use-css-displaytable-for-layout