使这个layot的基本样式 [英] The basic style for make this layot

问题描述

它看起来像一个表，但是我想通过使用CSS实现它。

It looks like a table, but I'd like to implement it by using only CSS.

这个布局最强大的风格是什么浏览器？

What is the most robust style for this layout that works with all browser?

        _________
        | A |__b__|
        |_A_|__c__|

<div class='container'>
        <div class='sectA'> A </div>
    <div>
        <div class="sectB"> b </div>
        <div class="sectC"> c </div>
    </div>
</div>

推荐答案

您还需要一个div和两个类，很容易：

You need one more div and two more classes, but it's very easy:

HTML

<div class='container'>
        <div class='sectA'> A </div>
    <div class="separator">
        <div class="sectB"> b </div>
        <div class="sectC"> c </div>
    </div>
    <div class="clear">&nbsp;</div>
</div>

CSS：

.container div.sectA
{
    float: left;
    width: 100px;
    height: 100px;
    border: 1px dotted #000;
}

div.separator
{
    float: left;
}

div.sectB,
div.sectC
{
    float: none;
    width: 100px;
    height: 50px;
    border: 1px dotted #f00;
}

.clear
{
    clear: both;
}

点击这里查看示例。

这篇关于使这个layot的基本样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！