我有以下设置:
<div id="wrapper">
<div class="column1"></div>
<div class="column3"></div>
<div class="column2"></div>
</div>
#wrapper {
position:absolute;
}
每个“列”都有不同的宽度和float: left
。所以3列一起,比方说宽900像素;但是如果我放一个新列,我希望包装器自动获取它。
所以我想根据它使用JavaScript包含的列来设置包装器的宽度。
答案 0 :(得分:1)
$("#wrapper").width(function() {
var width = 0;
$(this).children('[class^="column"]').each(function() {
width += $(this).width();
});
return width;
});
答案 1 :(得分:1)
请勿使用花车,display:inline-block
(Demo)
答案 2 :(得分:0)
var w = 0;
$('#wrapper > div').each(function(index) {
w += $(this).outerWidth();
});
$('#wrapper').width(w);
答案 3 :(得分:0)
这是一个小提琴:http://jsfiddle.net/BramVanroy/sYMLr/
var totalWidth = 0;
$("div#wrapper > div").each(function(index) {
totalWidth += parseInt($(this).outerWidth(true), 10);
});
$("div#wrapper").width(totalWidth);