2013-07-15 6 views
-3

У меня проблема с выравниванием css divs. Я думаю, что выравнивание неверно. Прямо сейчас находится слева и будет лучше сосредоточено.Css divs выравнивание макета

http://bit.ly/VOqkhw

Я попытался с сНом «.post» и плавающим, но не работает. Можно ли это решить?

спасибо.

ответ

0

Такие макеты обычно требуют интенсивного использования Javascript. Один из способов добиться того, что вы пытаетесь создать N столбцов, и динамически заполнить их с помощью JS + скрыть/показать столбцы с помощью запросов @media. В этом случае HTML бы что-то вроде этого:

<div class="content"> 
    <div class="column"> 
     <div class="post"> 
     ... 
     </div> 
     <div class="post"> 
     ... 
     </div> 
    </div> 
    <div class="column"> 
     <div class="post"> 
     ... 
     </div> 
     <div class="post"> 
     ... 
     </div> 
    </div> 
</div> 

На $(window).resize() (JQuery) нужно добавить или удалить column с и повторно организовать post сек в зависимости от их ширины и высоты. И вы будете использовать запросы средств массовой информации, чтобы установить ширину отображаемых столбцов, в значительной степени, как так:

@media all and (max-width:1000px) { 
    .column{width:50%;} /*that would make two equal columns 
    when the screen width <=1000 */ 
} 

@media all and (max-width:1500px) { 
    .column{width:33.3333%;} /*that would make three equal columns 
    when the screen width <=1500 */ 
} 

.post {width:100%;} 
.column {float:left;} 

Если бы вы предоставить более подробную информацию - вы получите более подробный ответ и меньше downvotes.

+0

ok! Я попытаюсь проверить медиа-запросы. – markobarna

0

Возможно, попробуйте поместить разделитель div в листе foliogrid, а затем поместите центр выравнивания текста на листе.

Смежные вопросы