3

ここに問題があります：同じ行に2つのフローティングdivが必要です。右のdivは固定幅にすることができます。左のdivは、残りのスペースをすべて取り、テキストを内側に折り返す必要があります。親コンテナの幅は可変であるため、両方のdivに幅を設定することはできません。

http://jsfiddle.net/af6wP/

div{border: 1px solid black}
.left{float: left}
.right{float: right}
<div class="left">
    very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text 
</div>

<div class="right">
    short text
</div>
4

2 に答える 2

11

ここではフロートが 1 つだけ必要なようです:

div{border: 1px solid black}
.left{ overflow: hidden; }
.right{float: right}

例http://jsfiddle.net/KmPjL/

于 2013-02-15T11:08:49.643 に答える
0

編集

右の div の固定幅に対するより良い解決策を得ました:

HTML

<div class="left">
    <div class="right">
        short text
    </div>
    very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text very long text 

</div>

CSS

div{border: 1px solid black;}
.right{float:right;width:24%;}

更新されたフィドルを参照してください

適切なコンテナに長いテキストがある場合は、clearfixを使用する必要があります。

于 2013-02-15T11:11:39.877 に答える