我设法创建了这段代码,使div.full_width_no_padding完全填满浏览器的宽度。它在桌面浏览器中运行良好,但在iphone、nexus等移动设备上不起作用。
有没有其他方法可以做到这一点?
js
(function ($) {
$(document).ready(function() {
$(".full_width_no_padding").width($(window).width());
var marginLeft = ($(window).width() - $('#region-content').width()) / 2;
$(".full_width_no_padding").css( "margin-left", -marginLeft );
$(window).on('resize', function(){
$(".full_width_no_padding").width($(window).width());
var marginLeft = ($(window).width() - $('#region-content').width()) / 2;
$(".full_width_no_padding").css( "margin-left", -marginLeft );
});
});
}(jQuery));html
<div id="region-content" style="width:960px">
<div class="full_width_no_padding" >content here</div>
</div>发布于 2015-03-10 22:35:36
我将用非常简单的步骤解释这一点:
1-删除该Javascript。
2-将这个添加到你的css中:
body,html{padding:0;margin:0;}3-确保所有的父母都有width:100%。
Generally, you can assume that _all_ block-level elements have (by default) `width:100%`.4-利润!
https://stackoverflow.com/questions/28966231
复制相似问题