Question

如何将两个div放在彼此旁边（左右），以便左div个自动尺寸取决于右div的宽度。< / p>

例如，如果正确的容器宽100px且容器中的div宽10px宽，则左div为90px宽。或者，如果右div为40px宽，则左边为60px宽。

由于

Answer 1

这是我经常使用的一个技巧

<style>
    .sidebar {
        width: 600px;
        float: left;
        background: #00ff00;
    }

    .content {
        margin-left: 610px;
        background: #ff0000;
    }
</style>

<div class="sidebar">
    sidebar
</div>

<div class="content">
    content
</div>

你设置一个元素的宽度并将其浮动，然后通过在浮动元素上放置一个与浮动元素相同的宽度来强制你想要坐在它旁边的元素进入间隙。

警告语：在此示例中，侧栏元素必须首先出现在源代码中。

您可以通过更改一个元素的宽度和另一个元素的边距来动态调整列的宽度。

将源代码保存到您的destop上的html文件中，然后了解它如何运作。

Answer 2

我同意上述评论。只需确保将float: right;想要的div放在屏幕右侧即可。我会把这作为一个额外的评论，但没有足够的代表这样做。

<style>
    .left {
        width: auto;
    }

    .right {
        width: 100px;
        float: right;
    }
</style>

将2个div放在一起，左边填充空格

2 个答案: