Troll Winner

WordPress: ускоряем процесс копирования контента

Часто перед контент-менеджером стоит задача скопировать контент (текст и изображения) из какого-либо источника на наш сайт, проще говоря «скопипастить» контент (ctrl+c, ctrl+v). Те, кто занимался этим, знают, что в этом процессе есть пара рутинных моментов — удаление лишней html-разметки, которая могла присутствовать на сайте-источнике, а так же закачивание изображений на хостинг сайта-получателя. Сегодня мы рассмотрим, […]

16 сентября, 2017

css :hover presudo-class

Transition миксин БЭМ-элемента

Никто не любит визуально скучные сайты, никак не реагирующие на действия пользователя, например, наведение мыши на элемент. Ускорим процесс написания стилей для их реагирование на состояние блока используя Transition миксин.

23 июля, 2017

Web-page layout with grid on the desctop and mobile

Генератор сетки без посредников

Использование сетки при разработки прототипа или макета сайта в последнее время стало обязательным условием. Для её создания создана масса инструментов, так же интернет пестрит подобными сервисами в огромном количестве. К сожалению, не все из них поддерживают дробные значения пикселей, что влечет за собой некоторую погрешность при генерации сетки с заданными параметрами. В определенный момент времени, […]

16 июня, 2017

Секция с подложкой

Типичная задача верстки: сделать секцию сайта с изображением в качестве бэкграунда. Весь блок должен быть адаптивным и полностью перекрыт изображением, без искажения самого изображения.

23 апреля, 2016

Заметки на ходулях

Не использовать свойство columns у <ul>, <ol>. Съедает маркеры. Применять к родительскому элементу; Overflow: hidden плохо работает у таблиц (и display: table); Position: absolute делает элемент блочным, за исключением элементов с display:table; To be continued…

7 октября, 2015

Избавляемся от скачков страницы при загрузке изображений

Существует проблема скачков страницы сайта после её открытия из-за последующей загрузки изображений. Особенно это заметно, если пролистать страницу, насыщенную изображениями, до конца и обновить её. Конечно же, можно указать фиксированные размеры изображения, однако в таком случае мы сильно потеряем в адаптивности страницы.

22 августа, 2015

Style guide

Некоторые важные моменты, касающиеся верстки, собранные из популярных источников, практики и собственного опыта. Подробнее

15 августа, 2015

Вариация на тему «Оформление dl»

Задача: оформить dl-список так, чтобы термины и определения были по левую и правую сторону соответственно. При этом необходимо учесть возможность присутствия двух или более терминов, а так же двух или более определений. Less/Scss/Stylus [crayon-5f6bc6888ac5a458505674/] Css [crayon-5f6bc6888ac60593303456/]  

16 июля, 2015