Rooc

Периодически при верстке сайтов возникают задачи которые требуют нестандартной верстки колонок. Стандартным способом я называю способ “плавающих” блоков. Традиционный способ <div class="grid"> <div class="col"></div> <div class="col"></div> </div> grid – контейнер колонок, одновременно это решение проблемы схлопывания, contain float col – колонка. .grid { *zoom: expression(this.runtimestyle.zoom=\”1\”, this.appendchild(document.createelement(\”br\”)).style.csstext=\”clear: both; font: 0/0 serif”); *zoom: 1; } .grid:before,.grid:after { [...]

Верстка форм это по сути верстка многоколончатой структуры, но дело усложняется тем что в дизайнерских макетах не часто встретишь строгую сетку и пропорции форм могут меняются даже в рамках одного сайта. Задача Общую конструкцию форм условно можно разделить на две группы – вертикальные и горизонтальные, или лучше – блочные и строчные. Пример блочной формы: Рис.1 [...]

Наверно любой верстальщик иногда анализирует код когда встречает какую либо прикольную фишку на сайтах. Иногда еще и сохраняет куски кода для последующей медитации на нем. Мне больше нравится слово тупить но оно слегка предсказывает результат ) Короче говоря, мне было интересно посмотреть как верстается и оформляется показ кода разными верстальщиками. ryanfait.com <ol class="code"> <li>&lt;input type="radio" [...]

В веб разработке мы постоянно имеем дело с блоками, «строительными кирпичами» веба. Несмотря на кажущуюся простоту этого элемента, у которого есть два принципиальных параметра, высота и ширина, выбор не является тривиальным делом. Но у нас есть золотое сечение, приблизительно 1:1.618, проверенное столетиями в архитектуре, книгоиздании, а теперь еще и в твитере. Математическая уникальность Золотая пропорция уникальна тем что если удалить из нее квадратную область то оставшийся прямоугольник опять будет иметь [...]

21 век, человек побывал на луне, сделан искусственный глаз, даже с зумом! и бля – нет простого очевидного способа вертикально выровнять элемент в CSS ) Столкнулся с дизайном в котором надо было сделать строку элементов разной высоты выровненной вертикально, вроде этого: На самом деле в общем случае задача дробится на две – случай когда у [...]

Элемент target это элемент с идентификатором (ID) на который мы ссылаемся ссылкой типа – site.com/page.html#id. И псевдокласс :target как раз срабатывает при обращении к этому элементу. К примеру селектор #someid:target сработает когда мы сошлемся на этот элемент – site.com/page.html#someid. Три раза переписывал, все равно отстой ) Этот селектор можно использовать нетипичным способом. Например при обращении [...]

Как для меня так множественные фоновые картинки как возможность из CSS3 намного поинтереснее заюзанных переюзанных скругленных мать их уголков. Скругляется щас все и везде, царапаются что ли острые углы на кнопках ). Ладно. Надо было сверстать вот такой блок. Само собой данные в столбцах могут изменится как угодно, поэтому нужно чтобы вся конструкция тянулась в [...]

Очень удобная штука если вам надо сделать что то типа такого:

Как то в одной из работ встала задача сделать фон страницы градиентом, вот в таком духе: