Question

我有一个容器，有2个div并排浮动。

第一个div没有应用固定宽度，而第二个div没有。我想要的是第一个div在第二个div没有渲染时展开全宽。

然而，我面临的问题是，当div 1中的段落变长时，它不会像它应该的那样换行，而是最终在div2下包含div1。我希望实现的是长段包装在div 1中并尊重浮动的div 2。

下面的代码可以更好地解释....

<div style="width:600px; height: 600px; margin-left: auto; margin-right: auto; border:1px solid blue;">
        <div style="float:left; border:1px solid green;">
            <p>Main long text jhjkhjkhjkhjk hj hjkh jkh jkh jkh jkh jkh jk hjk h jkh jh jkh jkh jkh jk hjk hjk hjkhkjhjkhjkhjkhjkhjkhjkhjkhjkhjkhjkh</p>
        </div>
        <div style="float:right; border:1px solid red; width: 200px;">
            <p>Secondary</p>
        </div>

提前致谢

Answer 1

为第一个内部div添加宽度

<div style="width:600px; height: 600px; margin-left: auto; margin-right: auto; border:1px solid blue;">
        <div style="float:left; border:1px solid green; width: 396px;">
            <p>Main long text jhjkhjkhjkhjk hj hjkh jkh jkh jkh jkh jkh jk hjk h jkh jh jkh jkh jkh jk hjk hjk hjkhkjhjkhjkhjkhjkhjkhjkhjkhjkhjkhjkh</p>
        </div>
        <div style="float:right; border:1px solid red; width: 200px;">
            <p>Secondary</p>
        </div>

流体浮动div与文本包装

1 个答案: