我试着为这个问题找到一个可以理解的答案,但是放弃了。
为了让动态的内容(如博客文章和图片)在水平网站(如thehorizontalway.com上)中,你必须在像素中设置一个固定的正文宽度,对吧?因为您在其中使用了浮动元素,否则将根据浏览器的宽度对页面进行拆分和折回。
编辑!这个特定值可以用jQuery计算出来,感谢这一点:)在这个例子中,向总大小添加了一个附加值,该值可用于浮动元素之前的内容。现在body获得了动态宽度!
我最初的想法是让jQuery为我们计算:(‘每个帖子的宽度’*‘帖子的数量’)+ 250 (额外的内容)
HTML代码
<body style="width: ;"> <!-- Here we want a DYNAMIC value -->
<div id="container">
<div id="menu"></div> <!-- Example of extra content before the floats -->
<div class="post">Lorem</div>
<div class="post">Lorem</div>
<div class="post">Lorem</div> <!-- Floated elements that we want the sizes of -->
<div class="post">Lorem</div>
</div>
...
<!-- So if these posts were 300px exept the last that was 500px wide, then the BODY WIDTH should be ( 300+300+300+500 ) + 250 [#menu] = 1650px -->
来自Alconja的结果和答案
$(document).ready(function() {
var width = 0;
$('.post').each(function() {
width += $(this).outerWidth( true );
});
$('body').css('width', width + 250);
});
非常感谢!
https://stackoverflow.com/questions/1015669
复制相似问题