三列布局 - 没有浮动的对齐

时间:2012-11-28 21:04:14

标签: html5 css3 layout

据我所知,在现代web开发中,水平对齐元素并排是通过使用float(例如,通过浮动两个到一个方向和另一个方向实现三列布局)。然而,这确实带来了各种问题,目前我正在开发一个网站,在标题和内容中都需要单独的列,因此我需要浮动几乎所有内容并设置各种边距和宽度以防止它们跳到各处

随着HTML5和CSS3的兴起,我想知道是否有一些东西可以用更简单的解决方案替换浮动?因为它是HTML5和CSS3引入了更简单的方法来使某些事情发生(比如使用border-radius圆角),所以人们会认为网站中的多个列几乎是不可避免的,这样可以减轻麻烦。

2 个答案:

答案 0 :(得分:1)

是的,它是flexbox,或CSS Flexible Box Layout Module

规格似乎相当稳定,因为它已达到Candidate Recommendation状态。我不知道这个最新版本的浏览器支持有多好。

这是recent article

答案 1 :(得分:0)

您是否查看了Twitter Bootstrap等任何响应式框架?使用响应式框架,可以根据屏幕大小轻松设置列。

据我所知,除了使用浮点数和动态宽度创建自己的列之外,没有内置的CSS属性。