2012-07-17 99 views
3

我要用CSS创建一个水平网格布局。 (我会让它通过jQuery和this解决方案水平滚动请注意,滚动是不是我的问题我的问题是关于建立网格。)用css创建网格布局

这是一个例子:

我有搜索互联网关于CSS网格,但似乎他们不能帮助我...

我的问题是,如何创建像上面的图像?我应该为此使用哪些插件或css属性?

编辑:我想有行的固定数量(我的意思是,行的数量应变化,当我调整页面应该有一个滚动条,而不是。)(我将内部使用与overflow: auto一个div)

+0

现在不要生气,但要在网格中显示什么样的数据?表格数据? – 2012-07-17 18:11:24

+1

@MrLister每个字段包含一篇文章的摘要。 – 2012-07-17 18:13:09

+1

不用担心Mahdi--很高兴你有一个对你有用的答案。 – BonyT 2012-07-17 21:29:05

回答

5

display:tabledisplay:table-rowdisplay:table-celldisplay:inline-block

这些CSS属性可以帮助,只是看看他们在本地的CSS信息网站。

table -values让每个元素的行为都像一个表,而不用实际使用一个表。这可能是您的问题的一个很好的解决方案。

inline-block - 值解决了负担问题,飘浮在水上的布局具有与块显示在线,就像img秒。当然,在旧版浏览器中几乎没有这种支持。

+0

这有什么问题? http://jsfiddle.net/ZUNxD/1/它改变divs的大小,以适应页面,但我不想这...另外'边际'不工作... – 2012-07-17 18:27:42

+0

表试图适合所有可用的宽度。你可以用'width'属性强制更大的尺寸;在你的小提琴中,将它设置在'.a'类中。 – amon 2012-07-17 18:29:50

+0

那么'保证金'呢?为什么它不起作用? – 2012-07-17 18:38:33