Вопросы Теги

Множественные центрированные плавающие блоки div в жидком макете

У меня есть идея макета, который я хотел бы использовать, но я не могу заставить его работать правильно. Я надеюсь, что кто-нибудь из присутствующих здесь сможет помочь, так как я потратил часы на поиск.

Схема такая.

Один div-оболочка содержит 6 дочерних div. Эти дочерние блоки div должны быть центрированы ВСЕ раз, независимо от размера div-оболочки. 

<html>
<head>
<title>Testing</title>
<style>
br.clear { clear:both; display:block; height:1px; margin:-1px 0 0 0; }
#wrapper { max-width: 960px; min-width: 320px; background: #444; margin: 0 auto; }
.box { width: 280px; padding: 10px; margin:10px; height: 260px; border: 0px; float: left; background: #fff; }
</style>
</head>
<body>

<div id="wrapper">
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
    <div class="box"></div>
    <br class="clear" />
</div>

</body>
</html>

Проблема заключается в том, что размер браузера уменьшается в меньшем размере, а поле, выбранное в строке ниже, загорается влево , а я хочу, чтобы они всегда были в центре внимания. Возможно ли это с использованием чистого CSS или мне нужно использовать jquery?

6
задан mskfisher 5 June 2012 в 14:23
поделиться