html - 网页大小问题

Question

我正在制作一个由居中表格组成的网页。当我的浏览器全屏时它工作正常，但是当我缩小浏览器时(或者当我使用浏览器空间较小的计算机时，比如 Mac)，部分表格被截断，它不会让我滚动向上看整个表。下面的图片显示了页面的外观和截断时间。

这是我的表格 CSS:

#inputTable {
    width:600px;
    height:780px;
    position:absolute;
    margin-left: -300px;
    margin-top: -390px;
    top:50%;
    left:50%;
    box-shadow: 5px 5px 5px 5px #06246F;
    table-layout:fixed;
    overflow:auto;
}

Answer 1

这是导致您的问题的 css 中的一些东西的混合(如其他人所述)。一种解决方案可能是采用不同的方法来使您的内容居中。

分别使用带有显示表格和显示表格单元格的容器和内容 div。

.container
{
    width:100%;
    height:100%;
    display:table;
    text-align:center;
}
.content {
    display:table-cell;
    vertical-align:middle;
}

我做了an example in JSFiddle .

对于较大的屏幕，您始终可以使用最大宽度和高度，但您需要百分比以确保它在较小的设备上可见。