如何自動設置寬度？

我需要創建一個包裝（容器）與（2〜4個格內），如：如何自動設置寬度？

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

我的問題是，我不能設置寬度內的div，因爲他們必須有一個等於寬度，所以如果我的包裝是300px，我只有兩個內部div（150px一次）等等等

但我不能將寬度設置爲.css文件，因爲如我所說，可以從2到4個divs。

問題是：是否可以自動化內部div（獲取整個包裝的寬度）？

謝謝！

來源

2012-04-19 Dail

可以使用display:table屬性是：

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

檢查此http://jsfiddle.net/7E9Nj/

來源

2012-04-19 10:07:55 sandeep

也許使用百分數？如果您有2個div，請在每個div上輸入style="width:50%"。如果您有4個div，請在每個div上放置style="width:25%"。

來源

2012-04-19 10:00:08 sp00m

是的，我能做到這一點，但也不是沒有可能呢？我的意思是......他們可以自動自動大小而不設置％？ – Dail 2012-04-19 10:02:02

您可能希望嘗試％你內心的div

例如，你可以有這樣的事情：

<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-19 10:03:41 allanminium

嘗試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-19 10:10:39

你可以這樣做只是

#wrapper > div { 
    float:left; 
    width:25%; 
}

來源

2012-04-19 10:14:06

如何自動設置寬度？

回答

相關問題