CSS响应式设计 - 中心对齐包含流体div的两个div

时间:2013-02-01 16:04:37

标签: css responsive-design center

我有一个网站,我需要做出回应。

我有一个包含div的流体,并且在容器内有浮动的div,它们不能改变大小,但希望它们保持在中心并具有相等的间距。任何想法?它们在开头会排成3行,然后会减少到2行,然后是1行。

.container {width:100%; text-align:center;}
.qitem{display:block;text-align:left;float:left;width:320px; height:300px}
.qitem:nth-child(odd) {margin-right:1%;margin-left:10%;}
.qitem:nth-child(even){margin-right:10%;margin-left:1%;}

2 个答案:

答案 0 :(得分:2)

这很好用

 .qitem{display: inline-block;text-align:left;float:none;width:320px; height:300px}

答案 1 :(得分:-1)

如果您的网站目前在线,我建议您不要针对像响应式设计这样的常见问题实施自己的解决方案。使用CSS框架为您完成工作,这里有8个好的CSS框架选择你想要的任何一个:

http://webdesignledger.com/tools/8-useful-responsive-css-frameworks

如果不能使用框架,请看一下上一个问题:

Fastest Way to Make Website Responsive?