Comments 98
по-моему очень нужная ссылка - http://code.google.com/p/blueprintcss/ , отличный css-фреймворк построенный как раз на grid-модели. в его дистрибутиве есть также ruby-script позволяющий задать параметры ширины колонок, сетки в целом, etc, если вы хотите что-либо отличающееся от умолчальных настроек.
Я знаю. Но этот отдельный рассказ ;) Я планирую написать о Blueprint CSS и о его возможностях.
Ещё есть YUI Grids. Порой кажется, что YUI слишком уж монстроподобна, но если разобраться вполне можно использовать.
А ещё я бы отметил YAML: Yet Another Multicolumn Layout - http://www.yaml.de/
Но как мне показалось - не такой удобный как BlueprintCSS
Но как мне показалось - не такой удобный как BlueprintCSS
Чтобы чистить плавающие блоки, достаточно родителю указать { overflow:hidden;width:100%; } (т.е., любую ширину, но это обязательно). И не надо никаких клирфиксов. Это прошлый век :)
Согласен, но именно для Сетки больше подходит такой подход. Так как контейнер может содержать не только колонки но и другие плавающие блочные элементы. Для данной реализаций .clearfix вообще можно избежать, веди .column и так содержит свойство overflow: hidden и имеет фиксированную ширину. Просто как всегда не повредит.
Такой подход избыточен. Не стоит плодить сущности сверх необходимости.
Только если это не библиотека.
Мы из разных религий, да. Я-то думал, библиотека — это набор нужных вещей, а не всё-что-только-можно-да-побольше-побольше.
Вот здесь, кстати, довольно внятно рассказывается про очистку.
Вот здесь, кстати, довольно внятно рассказывается про очистку.
.clearfix полезная вещь. К томуже в моём примере он не засоряет разметку.
Не вижу его пользы, когда есть более простое решение, работающее везде и, к тому же, не использующее хаки.
В любом случае здесь речь идёт о Сетке и как она реализована не имеет значения, значения имеет сама концепция. Я согласен с вами что этот способ очистки блоков гораздо проще. Просто речь здесь идёт о библиотеки, clearfix правило которое в ней используется, применять его или нет ваше - решение ;)
В данном случае вы предлагаете реализацию концепции в виде библиотеки. Строить библиотеку на устаревших и неверных решениях — плохой подход.
Назовите хотя бы одну причину почему clearfix хуже?!
1. Использует хак
Ну ка давайте раскажите в каком месте это хак, то он делает не так?
Вот здесь:
И здесь:
content: ".";И здесь:
/* Hides from IE-mac \*/
UFO just landed and posted this here
И получить проблемы с overflow: hidden, когда переполнение скрывается, когда это не надо (например, если есть абсолютно позиционируемые блоки). Easy Clearing надёжнее.
Как раз буквально вчера наткнулся вот на такую штуку http://960.gs/
UFO just landed and posted this here
Друзья говорят - семантическая верстка
UFO just landed and posted this here
поменьше хамства, парень, коли сам уж не знаешь спецификаций.
никаких столбцов и колонок с контентом в таблице нет. есть ряды и ячейки.
никаких столбцов и колонок с контентом в таблице нет. есть ряды и ячейки.
Модульная сетка не несёт никакого смысла (она лишь помогает упорядочить визуальное представление информации). Поэтому используя таблицы, вы привносите в документ ненужный смысл.
ммм, как-то ничего нового не узнал ;)
а почему верстка монгоколоночного сайта стала теперь отдельной религией? -))
кстати, вы могли бы упомянуть, в качестве теоретического бонуса, о концепции модульных сеток пришедших в веб из книжного, газетного и журнального дизайна и, в свою очередь, породивших потребность вот в таком подходе со стороны верстальщиков. я думаю не все знают истоков.
p.s. не хотел задеть, просто положительное настроение с утра -)
а почему верстка монгоколоночного сайта стала теперь отдельной религией? -))
кстати, вы могли бы упомянуть, в качестве теоретического бонуса, о концепции модульных сеток пришедших в веб из книжного, газетного и журнального дизайна и, в свою очередь, породивших потребность вот в таком подходе со стороны верстальщиков. я думаю не все знают истоков.
p.s. не хотел задеть, просто положительное настроение с утра -)
Если честно мне и так пришлось урезать статью больше чем на половину и оставить на мой взгляд самое главное. Про Сетку можно писать и писать...
P.S. написал статью прежде всего из-за того что во всём рунете не нашёл ничего про Сетку.
P.S. написал статью прежде всего из-за того что во всём рунете не нашёл ничего про Сетку.
UFO just landed and posted this here
а что для вас - азы верстки?
если говорим о html,css-верстке - то человек владеет предметом, это видно.
p.s. наверное все-таки "азы верстки", Азов - это город такой -)
если говорим о html,css-верстке - то человек владеет предметом, это видно.
p.s. наверное все-таки "азы верстки", Азов - это город такой -)
это говорит человек написавший выше эдакий шедевр про "это таблица колонки и все такое" )
а собственно таблицы это не азы? Все верстальщики начинают разметку делать на таблицах, а уже потом, когда начинают понимать некоторые тонкости, переходят на верстку дивами.
отучаемся говорить за всех.
вы вот наверное сразу как узнали что существует хтмл, начали верстать дивами без использования таблиц, кросбраузерно и хорошо?
Я в этом сильно сомневаюсь — что бы начать понимать как это работает и видеть подводные камни нужно не один сайт сверстать и методом проб и ошибок выйти уже на уровень дивов, хотя я не приверженец.
Так что не рассказывайте мне сказки.
Я в этом сильно сомневаюсь — что бы начать понимать как это работает и видеть подводные камни нужно не один сайт сверстать и методом проб и ошибок выйти уже на уровень дивов, хотя я не приверженец.
Так что не рассказывайте мне сказки.
Я лично начал свое знакомство с верстанием с книги "XHTML b CSS 2"
И что вы сразу строили сложные интерфейсы при помощи только дивов и не делали каркас для первых сайтов на таблицах?
И почему у многих складывается мнение что в спецификации xhtml не может быть таблиц?
И почему у многих складывается мнение что в спецификации xhtml не может быть таблиц?
С первых страниц автор меня погрузил в стандарты и правила. Я сидел днями и учился делать колонки на дивах, таблицы только для вывода табличных данных.
Сейчас я уже сразу смотря на макет вижу кучу дивов, я даже не могу себе представить как это на таблице делается, ведь тогда идет просто захламление кода. Как в анекдоте про верстальщика в поезде "td td td td"
Сейчас я уже сразу смотря на макет вижу кучу дивов, я даже не могу себе представить как это на таблице делается, ведь тогда идет просто захламление кода. Как в анекдоте про верстальщика в поезде "td td td td"
Стандарты — это хорошо, но что нестандартного в таблице и что есть табличные данные? Изображения и текст не являются ими? А ведь из них и строится сайт
Я например предпочитаю верстать смешанным методом, хотя могу и только дивами.
А по поводу захламленности кода с таблицами, то это не всегда, иногда больше хлама дают дивы.
Я например предпочитаю верстать смешанным методом, хотя могу и только дивами.
А по поводу захламленности кода с таблицами, то это не всегда, иногда больше хлама дают дивы.
Совету проникнуться XHTML ибо я смотрю не понимаете вы всех вкусностей. Не надо забывать и об XML...
Вы не правы. Верстаю только xhtml, так как давно проникся, я говорю о том что xhtml это не только дивы — это тот же html но более строгий.
Кстати вы лукавите говоря о том что с самых первых проектов верстаете без таблиц. Заглянул в ваш жж и увидел "ваш второй сайт" и там используются таблицы, кстати в том случае очень просто обойтись без них.
Кстати вы лукавите говоря о том что с самых первых проектов верстаете без таблиц. Заглянул в ваш жж и увидел "ваш второй сайт" и там используются таблицы, кстати в том случае очень просто обойтись без них.
Ну а XML как исключает <table>?
Вы в общем-то умные вещи говорите, но немного преувеличено и пытаетесь уже просто оперировать терминами.
Вы в общем-то умные вещи говорите, но немного преувеличено и пытаетесь уже просто оперировать терминами.
xml — исключает, но это совсем не одно и тоже что xhtml и нужен он немного для другого
Я это все понимаю. Мы же говорим в контексте верстки страниц.
XHTML это и есть XML. В чистом виде XML вообще ничего не исключает так как ничего и не знает о элементах которые в нём содержатся, до тех пор пока мы не применим DTD или Schema к документу.
Я вот с HTML познакомился через Fireworks. Рисуешь - режешь, а он тебе генерирует HTML на таблицах. И везде работает именно так как нарисовал. Давно это было конечно. А сейчас со мной работают два парня по 18 лет и они вообще не понимают как можно было верстать на таблицах :)
да, представь себе. мой первый сайт был на дивай и ифреймах. правда там была одна таблица - главное меню в соответствии с моей "гениальной" дизайнерской задумкой на дивах кроссбраузерно было не сверстать.
да что вы говорите; я научилась верстать дивами раньше чем вообще узнала теги табличной разметки, видимо преподаватель грамотный попался
UFO just landed and posted this here
Верстка сеткой конечно интересная методика, но обоснованное ее применение — очень уж редко встречается.
UFO just landed and posted this here
вот-вот, и я о том же
кхе, если мы уж совсем оторвемся от способов реализации, то совсем не важно каким кодом будут верстаться колонки на сайте.
грамотный верстальщик сам определит табличками ему верстать либо дивами, либо смешанным способом.
p.s. вы какой-то озлобленный ортодокс.
грамотный верстальщик сам определит табличками ему верстать либо дивами, либо смешанным способом.
p.s. вы какой-то озлобленный ортодокс.
Может я чего не понимаю, но зачем вытаскивать лишний код ради универсализации? Такое решение подойдет для какого-нибудь CSS фреймворка или большого проекта с общим файлом стилей.
Макетная сетка может быть виртуальной: http://harisov.livejournal.com/70420.htm…
Я уже очень давно делаю всё на колонках, это как само собой разумеющееся.
А набор готовых классов считаю делать неразумным. Только если в очень уникальных случаях.
А набор готовых классов считаю делать неразумным. Только если в очень уникальных случаях.
А как быть с тем, что страница не «тянется»?
как раз недавно за полчаса применил Blueprint как основы простой темы к Друпалу.
http://akzhan-mdev.mhost.ru/.masterflow/release-1.1
P.S.: сейчас гляну, какие есть сетки для резинового лэйаута.
http://akzhan-mdev.mhost.ru/.masterflow/release-1.1
P.S.: сейчас гляну, какие есть сетки для резинового лэйаута.
реализация таблицы на дивах :)
Grid and Design — лучшее средство для верстки по сетке.
хм.. по поводу целесообразности использование Сетки у меня есть возражение: как часто вы видете макет нарисованный по сетке? чаще всего встречаю нарисованный от балды дизайн
Sign up to leave a comment.
Grid Design или вёрстка с Сеткой.