Question

我有一个100％的div宽度a和一个宽度为3000px的div的隐藏溢出。我希望3000px div在左右均匀切断。我会使用background-position：center;然而，它比那更复杂。 3000px div拥有30个100px div。我尝试在3000px div的左侧和右侧使用自动边距，但它不起作用。这是css：

.bgAnimHolder{
    width:100%;
    height:500px;
    overflow:hidden;
    position:absolute;
    z-index:1;
    top:0px;
}

.row{
    margin: 0 auto 0 auto;
    height:500px;
    width:3000px;
}

.row div{
    width:100px;
    float:left;
    margin-top:0px;
}

无论屏幕分辨率如何，如何将3000px div安排在屏幕中间？我愿意使用CSS或JavaScript，以解决问题为准。谢谢！

Answer 1

您可以使用CSS：

.row {
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -1500px; /* half of the width */
    height: 500px;
}

确保父母上面有position: absolute/relative

Answer 2

我可能不了解您问题的根源，但您可以将容器的左右边距设置为（相同）负值。我的代码是为了简洁/清晰而简化的。

div.center 
{
    margin:1em -10em; 
    background:#CCC; 
    text-align:center; 
    padding:1em;
}

<div class="center">
    <p>Lorem ipsum dolor sit amet.</p>
</div>

如何居中对齐大于整个页面100％的元素？

2 个答案: