6

残りの幅全体を占めるように表示フィールドdivを作成したいと思います。これで、表示フィールドの幅はテキストの長さと同じになります。どうやってするか？

.display-label {
        float:left;
        clear:left;
        min-width:160px;
}

.display-field {
        float:left;
        clear:right;
}

<div class="display-label">Account Id</div>
<div class="display-field">30221</div>
<div class="display-label">Full Name</div>
<div class="display-field">Tomas</div>
4

3 に答える 3

3

からフロートとクリアを削除し.display-fieldます。.display-field div はブラウザーの左側から始まるため、出力を操作するには、目的の色を div に追加する必要があります。

.display-label {
        float:left;
        clear:left;
        min-width:160px; 
        background:white
}

.display-field {
    background:red
}​

デモ

于 2012-11-30T09:22:54.253 に答える
0

これが必要だと思います。

.display-label {
        float:left;
        clear:left;
        min-width:30%;
        background: red;
}

.display-field {
        float:left;
        clear:right;
        background: yellow;
        min-width:70%;
}

ライブデモを見る

min-width必要に応じて調整してください。

それがあなたを助けることを願っています。ありがとう ！！

于 2012-11-30T11:55:39.067 に答える
0

overflow:hidden;あなたの友達はここにいます。

   .display-label {
        float:left;         
        clear:left;         
        min-width:160px;
    }  
    .display-field {        
        overflow:hidden;
        background:#ccc;    
    }

jsfiddle の例はこちら

于 2012-11-30T10:33:07.843 に答える