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

Читать далее

css :hover presudo-class

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

Читать далее

Web-page layout with grid on the desctop and mobile

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

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

Читать далее

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

171900_10151236273983571_1504363868_o

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

Читать далее

Задача: оформить dl-список так, чтобы термины и определения были по левую и правую сторону соответственно.

При этом необходимо учесть возможность присутствия двух или более терминов, а так же двух или более определений.

Less/Scss/Stylus

Css

 
Читать далее