我正在构建一个响应式设计,我需要两个等高的列。我不想依赖 JavaScript,我希望列之间有空格以增加可读性。
我做了两个布局;一个使用display:table;
,另一个使用float
andposition
。这里的问题是我似乎无法让后一种方法在列之间有空格,而 table 方法在这方面工作得很好。
因此,理想情况下,我希望使用表格方法,但我想知道这是否是一种可接受的方式来为将利用现代 Web 标准的网站实现等高列设计?
CSS表格支持研究
通过一些研究,我发现该display:table
方法与以下浏览器兼容(通过支持我需要的所有必要的 CSS 属性):
- 铬 1+
- 火狐 1+
- 互联网浏览器 8+
- Safari 1.2+
- 歌剧 7+
- 安卓2.1+
- iOS 3.2+
- 黑莓 6+
- Internet Explorer Mobile 9+ (Windows Phone 7+)
- Opera 移动版 10+
- 歌剧迷你 5+
- 诺基亚浏览器 7.3+ (Symbian Anna)
- 诺基亚浏览器 8.5+(诺基亚 N9 上的 MeeGo 1.2)
Google 搜索“CSS 显示表是个好主意吗?” 揭示了几篇反对CSS表格方法的文章,特别是我一直在阅读的这篇文章。我知道它已经有好几年了,那么考虑到我在上面发现的浏览器支持水平,现在这种方法的总体接受度到底是多少?
笔记
我想放弃对 Internet Explorer 7 及更低版本的支持,我不确定 Firefox 3 及更低版本(欢迎提出建议)。
此外,我通常希望在较旧的浏览器/浏览器版本中进行测试,但我的笔记本电脑没有足够的 RAM 来运行虚拟机,并且在不稳定的 10-20 Mb/s 连接上下载必要的文件需要数小时。有没有其他选择(房子里的所有其他电脑也没有旧的浏览器)?
谢谢!