如何中心对齐大于整个页面的100％的元素？ [英] How can I center align an element that is larger than 100% of the entire page?

问题描述

我有一个div宽度a与100％和隐藏溢出持有一个div，宽度为3000px。我想要3000px的div被均匀地左右切断。我会使用background-position：center;然而，它比这更复杂。 3000像素的div包含30个100像素的div。我已经尝试使用左右的3000px div的汽车边距，但它没有工作。这里是css：

I have a div width a with of 100% and hidden overflow holding a div with a width of 3000px. I want the 3000px div to be cut off evenly on the left and right. I would use background-position:center; however, it's more complicated than that. The 3000px div is holding 30 100px divs. I have tried using auto margins on the left and right of the 3000px div, but it did not work. Here is the 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，以解决问题的必要。谢谢！

How can I arrange the 3000px div to be positioned in the middle of the screen, regardless of screen resolution? I am willing to use CSS or JavaScript, whichever is necessary to solve the problem. Thanks!

推荐答案

您可以使用css：

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

只要确保父项有位置：absolute / relative 即可

这篇关于如何中心对齐大于整个页面的100％的元素？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！