SNK Software
Web Studio Монополия Metaproducts Утилиты Игры
Монополию Web Studio Библиотека
Вебмастер Дельфи Работа на ПК Самоучитель
Для PHP Для Delphi
Веб-дизайн Программирование Компьютеры Девайсы Заметки
SNK Software Индустрия hardware Индустрия software
О студии Портфолио Сопровождение сайтов

Новые материалы

Девайсы:
Сравнительный обзор Nokia Lumia 920 и HTC 8X
Девайсы:
Обзор Nokia Lumia 820 – смартфона на WP8
Вебмастеру:
Настройка Apache, PHP и MySQL для Linux-VPS
Вебмастеру:
VPS на домашнем ПК: настройка сети в VM VirtualBox и Debian
Вебмастеру:
VPS на домашнем ПК: устанавливаем Linux Debian 6
Вебмастеру:
VPS на домашнем ПК: установка VM VirtualBox
Работа на компьютере:
Иные возможности текстового процессора Word
Работа на компьютере:
Вставка объектов
Работа на компьютере:
Таблицы в Word
Работа на компьютере:
Печать и сохранение документов
Работа на компьютере:
Сноски, колонтитулы, оглавление и указатели в Word
Вход на форум
Регистрация

Все форумы » Форум вебмастера » Технические вопросы: HTML, CSS, JavaScript » Съезжают блоки на стрнице (float)

Съезжают блоки на стрнице (float)

Сообщений 5
2011-06-04 19:42:33
Semen
Участник
Вопрос следующий: есть страница, на ней в несколько рядов и колонок идут блоки (картинка+описание). Блоки (div) сделаны с float: left. Так вот, если высота 3 - последнего в строке блока больше на 1 строку чем у других то отступ увеличивается на величину этой одной строки и следующий ряд ровный. А если у 1 или у 2 блока больше, то под ними получается большой пустое пространство. Можно ли не меняя верстку в CSS сделать так чтобы если в любом из верней строки блоков текста больше, нижний ряд шел ровно?
2011-06-04 19:47:23
Semen
Участник
Не меняя верстку HTML в смысле, а только стилями.
Кстати что-то не дало мне отредактировать сообщение - поправить дало а сохранить нет... хотя почти сразу пытался исправить.
2011-06-04 22:50:49
Serge
администратор
Semen, насколько я понял, код примерно такой:
<div>блок 1 стр 1</div><div>блок 2 стр 1</div><div>блок 3 стр 1</div>
<div>блок 1 стр 2</div><div>блок 2 стр 2</div><div>блок 3 стр 2</div>

?
В таком случае в CSS пишем:
div:nth-child(3n+1) {clear: both}
Поможет всем CSS3-совместимым браузерам, ключая Firefox 3+, Opera 9+ и Chrome. И даже последнему MSIE.
Сообщение оредактировано Serge в 2011-06-04 22:56:31
2011-06-04 23:16:18
semen
Участник
Да, именно так, только имя класса еще есть. Получается
div.myclass:nth-child(3n+1) {clear: both}
? ща проверим...
p.s.
Работает, респект!
p.p.s.
И правка заработала! :)
Сообщение оредактировано semen в 2011-06-04 23:16:53
2011-06-04 23:23:31
Serge
администратор
semen :И правка заработала! :)
Да, сейчас как раз сижу ковыряюсь с форумом. Там разные функции на проверку прав при отображении и при собственно правке, сейчас подправил.
Стр.: 1

Избранное

SNK GSCP
SNK GSCP - новая библиотека для PHP 5!
Web Studio
Web Studio и Visual Workshop
Библиотека:
Стандарты на web-технологии
Монополия
Монополия Android
Загрузки:
скачать программы
Продукция:
программы и книги
Техподдержка / Связаться с нами
Copyright © 1999-2020 SNK. Все права защищены.
При использовании материалов с сайта ссылка на источник обязательна.
Рейтинг@Mail.ru