1

<div/>「列 A」と「列 B」のように2 つの s を配置しました。列 B は設定された幅であり、列 A に残りのスペースを占有させたいと考えています。CSSでこれを達成する方法はありますか? それとも、私がやっていることのより良い代替案ですか?

これは構造です:

<div>
  <div id='colA'>style is float right</div>
  <div id='colB'>this has a set width of 50px</div>
<div>
4

2 に答える 2

5

を使用しdisplay: table-cellます。

#container{
    display: table;
    width: 100%;
}

#colA {
    display: table-cell;
}

#colB {
    display: table-cell;
    width: 50px;
}

デモを参照してください。

于 2013-04-23T15:37:10.953 に答える
3

それらの1つに使用floatし、その方向にフロートの幅に等しいマージンをもう1つに追加します..

<div>
  <div id='colA'>this has a set width of 50px and is floated</div>
  <div id='colB'>style has margin equal to floated width</div>
</div>

#colA {
    width:50px;
    float:left;
    background-color:red;
}
#colB {
    margnin-left:50px;
    background-color:green;
}

http://jsfiddle.net/C3caq/1/のデモ

于 2013-04-23T15:41:26.733 に答える