html - 网页大小问题

标签 html css

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

http://imgur.com/fqwURZb,JXin4Kb#0 enter image description here

这是我的表格 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;
}

最佳答案

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

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

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

我做了an example in JSFiddle .

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

关于html - 网页大小问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20744802/

相关文章:

javascript - HTML xpath 选择父元素的前一个兄弟

css - 使用 CSS3 选择器选中复选框时更改表格行颜色?

html - 有没有办法用 CSS 重新创建这个网格 slider ?

javascript - 单击按钮并打开子菜单后,如何使按钮保持在原位

javascript - 如何使用jquery显示列表中的3个随机项目?

javascript - 在javascript中将背景图像分配给另一个

php - FPDF - 找不到类 'App\Http\Controllers\FPDF'

css - CSS3转换方法和CSS2相对定位之间有什么区别?

javascript - 通过 Ajax 上传照片后替换 css 背景图像

javascript - 删除类后 JQuery 选择器仍然有效吗?