0

次のような(内部に2〜4 divの)ラッパー(コンテナ)を作成する必要があります。

<div class="wrapper">
   <div></div>
   <div></div>
   <div></div>
   <div></div>
</div>

私の問題は、内側の div の幅を設定できないことです。それらの幅は等しい必要があるためです。したがって、ラッパーが 300px で、内側の div が 2 つしかない場合 (150px は 1 回) などです。

しかし、幅を .css ファイルに設定することはできません。なぜなら、2 から 4 の div が存在する可能性があるからです。

問題は、(ラッパー全体の幅を取得するために) 内側の div を自動サイズ変更できるかどうかです。

ありがとう!

4

5 に答える 5

5

You can use display:table property for this:

.wrapper{
    width:300px;
    border:2px solid green;
    display:table;
}
.wrapper > div{
    display:table-cell;
    border:1px solid red;
    height:50px;
}

Check this http://jsfiddle.net/7E9Nj/

于 2012-04-19T10:07:55.660 に答える
1

多分パーセントを使用していますか?2 つの div がある場合はstyle="width:50%"、各 div に配置します。4 つの div がある場合はstyle="width:25%"、各 div に配置します。

于 2012-04-19T10:00:08.313 に答える
0

you might want to try % in your inner div's

for example, you could have something like this:

<div id="wrapper">
    <div style="width:25%"></div>
    <div style="width:25%"></div>
    <div style="width:25%"></div>
    <div style="width:25%"></div>
</div>
于 2012-04-19T10:03:41.093 に答える
0

あなたはこれを簡単に行うことができます

#wrapper > div {
  float:left;
  width:25%;
}
于 2012-04-19T10:14:06.077 に答える
0

jqueryを試してみてください。これは機能します。

$(document).ready(function(){
var divWidth = parseInt($('.wrapper').css('width'));
var divSizes = parseInt($('.wrapper >div').size());
var divWidth = divWidth/divSizes;

$('.wrapper >div').each(function(){
$(this).css('width', divWidth+'px')
})
})
于 2012-04-19T10:10:39.207 に答える