居中宽度在视口之外的元素
居中宽度在视口之外的元素
提问于 2014-08-21 19:18:11
我想对宽度超过视口的元素(即元素=1000 to / viewport =800 to)进行居中。我已经尝试过基本的CSS (边距=0自动)，但它不起作用。如果有人能帮我的话就太好了！
我有三个子元素(.project)，其宽度通过jQuery计算。此外，这三个子元素的和是我的父元素(#projects)的宽度。
这是一个jsFiddle。
干杯
$(window).on( "resize", function () {
var projectWidth = ( $(window).width() / 2.8 );
$(".project").css({ width : projectWidth.toFixed() });
var projectSum = 0;
$("#projects .project").each( function(){ projectSum += $(this).width(); });
$(".container").css({ width : projectSum });
}).resize();回答 1
Stack Overflow用户
回答已采纳
发布于 2014-08-21 19:40:11
这非常简单，使用CSS。下面是一个示例，其中body被设置为400px wide，600px的一个元素在中间对齐。
数学是简单的(containerWidth - divWidth) / 2，然后使用这个值作为margin-left和margin-right，您可以使用JS的动态宽度。
http://jsfiddle.net/da8y64ww/1/
body {
width:400px;
border:1px dotted blue;
margin:0 auto;
}
#foo {
width:600px;
height:100px;
border:1px solid green;
margin-left:-100px;
margin-right:-100px;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/25434308
复制相关文章
相似问题
腾讯云开发者
