0

中央のdivのみが固定幅であるのに、3つのdiv要素で親の幅を拡張する方法はありますか？中央のdiv要素の左右のdiv要素の幅は同じである必要があります。

私はこのようなものを機能させたい：

<div style="width:100%">
    <div id="elasticWidth1"></div>
    <div id="fixedWidth"></div>
    <div id="elasticWidth2"></div>
</div>

編集：これは結果がどのように見えるべきかです： ここに画像の説明を入力してください

4

2 に答える 2

2

次のようなものを使用できます：http： //jsfiddle.net/Urbrf/6/

html

<div id="wrapper">
    <div class="halfWidth left">
        <div class="padding">
            <div id="columnOne" class="fullWidth">
            </div>
            <div id="columnTwo" class="fixedWidth">
            </div>
        </div>
    </div>
    <div class="halfWidth right">
        <div class="padding">
            <div id="columnThree" class="fullWidth">
            </div>
        </div>
    </div>
</div>

CSS

#wrapper {width:100%;}
.halfWidth {width:50%;}
.fullWidth {width:100%;}
.left,
.left .fullWidth {float:left;}
.left .padding {padding-right:100px;} /*half of the fixed width*/
.right,
.right .fullWidth {float:right;}
.right .padding {padding-left:100px;} /*half of the fixed width*/

.fixedWidth {width:200px; margin-right:-200px; float:right;}
于 2013-02-18T11:23:02.523 に答える
0

floatを使用するのではなく、inline-blockを使用して実行します。

div {
    display: inline-block;
}

とにかく、弾力性がある場合、左右のdivの幅をどのように等しく設定しますか？

于 2013-02-18T11:08:40.533 に答える