Не раз сталкивался с «кастомной» версткой модальных окон и в случае, если нужно организовать прокрутку внутри этого окна + на странице есть фиксированные элементы на 100% ширины. В итоге, для некоторых элементов нужно сделать отступ, равный ширине скроллбара (scrollbar).
Все чаще использую svg в верстке и возникла ситуация, когда необходимо менять стили внутри svg изображения. При обычном встраивании через тег <img> невозможно манипулировать через css со стилями. Внедрять объект svg приносит свои неудобства (по крайней мере для меня), поэтому на просторах интернета был найден скрипт, который в случае, если к тегу <img> задан class=»svg» — преобразовывает тег <img> в объект svg на клиенте.
При достаточно сложной верстке приходится затачивать некоторые детали под специфику разных устройств. Естественно, в первых рядах идут устройства Apple. Следующие media queries позволят прописать CSS правила для IPad, в том числе с учетом ориентации экрана.
Делая сайт с адаптивным дизайном, столкнулся со следующей проблемой — на небольших экранах слова переносились не очень красиво. В поисках решений есть множество вариантов, но подразумевают либо ручную правку текста и вставкой спецсимвола мягкого переноса «­» или использование css свойства hyphens, за счет которого используются возможности браузеров для переноса строк, но оно поддерживается не всеми браузерами. Решение было найдено в виде простого плагина, описание которого в статье.
Часто делаю сайты на CMS и пока не освоил для них сборщики проектов. Однако, встречаются и простенькие сайты на чистом html, при разработке которых я использую сборщик проектов Gulp.