Html 在水平滚动条上居中显示内容
我正在设计一个适应的html模板，应该可以在桌面和移动浏览器上使用。在内容中，我有一个固定的表，它使用媒体查询缩小字体大小（标题和单元格），直到达到某个限制。 低于该限制，表格太密集，无法以该字体大小读取，因此我们宁愿保留它，即使它稍微超出了移动浏览器的可见部分 对于大多数手机和台式机来说，这不是问题，因为内容与中心对齐，并且有一个水平滚动条用于查看表中位于视口之外的部分 但iPhone上的Safari试图将所有内容都放在可见区域，事实上，将内容移到左侧，并在右侧留下一个大的空白区域，以便将桌子放进去 在下图中，橙色矩形表示视口，绿色矩形表示内容，“Div”矩形表示不适合视口的表格。注意，在左边的图像上，Div超出的部分是不可见的（我对这个解决方案没意见）。 如何在css中始终获得左侧图像的结果 以下是html的相关部分：Html 在水平滚动条上居中显示内容,html,ios,css,mobile-safari,Html,Ios,Css,Mobile Safari,我正在设计一个适应的html模板，应该可以在桌面和移动浏览器上使用。在内容中，我有一个固定的表，它使用媒体查询缩小字体大小（标题和单元格），直到达到某个限制。 低于该限制，表格太密集，无法以该字体大小读取，因此我们宁愿保留它，即使它稍微超出了移动浏览器的可见部分 对于大多数手机和台式机来说，这不是问题，因为内容与中心对齐，并且有一个水平滚动条用于查看表中位于视口之外的部分 但iPhone上的Safari试图将所有内容都放在可见区域，事实上，将内容移到左侧，并在右侧留下一个大的空白区域，以便将桌子
<body>
<div class="container">
<div class="row section">
<div class="col content">
<table width="100%">
<tbody>
<tr>
<td rowspan="2">
<div align="center" class="Style1">
title
</div>
</td>
<!-- Many Other <td></td> HERE -->
</tr>
<!-- Many Other <tr></tr> HERE -->
</tbody>
</table>
</div>
</div>
</div>
</body>
您可能需要为元素设置最小宽度设置以下内容就足够了：
.container {
overflow: auto;
}
为此，您需要将您的
cssminwidth.container {
overflow: auto;
}