浏览器大小 html css

Question

我一直在使用下面的css代码：

#MainBox
{   width: 488px;
    height: 181px;
    position: absolute;
    left: 50%;
    top: 236px; 
    margin-left: -244px; //this being half the width
} 

确保页面上的项目居中。问题是，当在 iphone 上查看此内容时（我假设在其他智能手机上类似），页面的左侧被切掉了！有谁知道我如何解决这个问题并使一切都适应？

谢谢！

Answer 1

您正在使用该 CSS 将元素向左移动 244 像素，而 iphone 屏幕非常小，导致它被切断。试试这个：

#MainBox{
    width: 488px;
    height: 181px;
    margin: 236px auto 0 auto;
}

Answer 2

上述使 div 居中的技术有点过时了。 使用边距：自动，宽度为固定值（您已经拥有），并使父位置：相对。