Jump to content
  • 0

Проблема с плиточной версткой


Адель
 Share

Question

Буду краток:

Нужно что бы вот это: http://ynws.esy.es/index2.html выглядело как это: http://ynws.esy.es/index.html
 

 

В чём соль:
По второй ссылке новости заданы структурой 4 колонки, а в них уже плитки.

По первой ссылке задан фиксированный размер родителя, а в нем плитки прижатые float:left. Как видите в этом случае вторая и последующие строки разъезжаются. 
 

 

Фиксированную высоту, пожалуйста, не предлагайте :)

Link to comment
Share on other sites

14 answers to this question

Recommended Posts

  • 0

Интересный вариант. 

 

Можете помочь? 

Возникла проблема, которая заключается в том, что элементы "наезжают" друг на друга по вертикали

 

 

P.S. Только что попробовал в разных браузерах, заработало в Firefox. Chrome и Opera отображают не верно

Edited by Адель
Link to comment
Share on other sites

  • 0

 

Вы не подключили jQuery.

Вот так должно быть:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script><script type="text/javascript"  src="scripts/masonry.pkgd.min.js"></script>

Ага... Всё вроде ничего, однако остаются мелкие недостатки: 

1)Последние элементы прижимаются по разному и иногда тоже наезжают на элемент выше.

2)Последовательность. Почему-то заполняется не построчно слева-направо, а в общем-то как ему удобно :-)

Link to comment
Share on other sites

  • 0

У меня они не наезжают. А вот последовательность, согласен, он располагает их так, что где выше всего он вставляет следующий элемент (не знаю правильно ли я выразился )) ).

Вот мой скрин. поставил .cell красную обводку, чтобы было более наглядно.

http://img208.imageshack.us/img208/4597/mepz.jpg

Edited by mrnobody
Link to comment
Share on other sites

  • 0

У меня они не наезжают. А вот последовательность, согласен, он располагает их так, что где выше всего он вставляет следующий элемент (не знаю правильно ли я выразился )) ).

Вот мой скрин. поставил .cell красную обводку, чтобы было более наглядно.

http://img208.imageshack.us/img208/4597/mepz.jpg

А какой браузер юзаете ? :-)

Link to comment
Share on other sites

  • 0

Хром 33.0.1750.149 m

В Мозилле (27.0.1) тоже все хорошо. Сейчас запустил в опере 12.16 и IE11 — все нормально.

Хм, можете взглянуть, возможно я что-то сделал не правильно: http://ynws.esy.es/index3.html

 

P.S. Косяк происходит при обновлении страницы.

Edited by Адель
Link to comment
Share on other sites

  • 0

 

попробуйте отключить шрифт вердана у селектора .text.

всё так же...

 

Ага, лоханулся я ))

Вот архив http://yadi.sk/d/TcS1k2_EKZGtN

 

Я изменил только index.html. И сделал и использованием jQurey после загрузки всей страницы. (событие load, не путать с событием ready - это разные вещи)

Edited by mrnobody
Link to comment
Share on other sites

  • 0

 

 

попробуйте отключить шрифт вердана у селектора .text.

всё так же...

 

Ага, лоханулся я ))

Вот архив http://yadi.sk/d/TcS1k2_EKZGtN

 

Я изменил только index.html. И сделал и использованием jQurey после загрузки всей страницы. (событие load, не путать с событием ready - это разные вещи)

 

Спасибо :) Теперь надо искать решение проблемы со строчной заполняемостью :)

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy