Добавить тень у after элемента

Имеется блок — выплывающее окно у которого after добавляет треугольную стрелочку, у блока требуется добавить тень. При добавлении тень игнорирует стрелочку, и для того, чтобы это обойти придется делать костыль. Добавить для тени before: .bt_delivery_win{ // выпадающее окно position: absolute; min-width: 300px; margin-top: 20px; padding: 20px 20px 20px 40px; color: #000000; background: #f0f0f0; box-shadow: 0…

Нарисовать треугольную стрелку css

Требуется нарисовать с помощью css треугольную стрелку для списка ▼ и поворачивать её при открытии/закрытии списка. <div class=»i_phone_main j_phone_main»> <span class=»i_phone_main_str»></span> </div> .i_phone_main_str{ transform: rotate(180deg); } .i_phone_main_str:after { content: » «; position: absolute; width: 0; height: 0; top: -5px; left: -18px; border: solid transparent; border-width: 4px; border-bottom-color: #fff; pointer-events: none; } .i_phone_main_str.hd:after { top: 0;…

Подводные камни адаптивной верстки

При верстке адаптивного сайта по мере его верстания всплывают некоторые моменты — подводные камни, с которыми рано или поздно придется столкнуться. Статья написана без логики, так сказать в боевом состоянии. Первый камень Когда полным ходом идет верстка, многие просто проверяют адаптив, путем изменения размера окна браузера. Там как правило все хорошо работает, особенно хорошо если…

Правила оформления css

Для удобного и быстрого чтения кода используют разные принципы написания стилей. Ниже приведены правила оформления .css которые наиболее удобны для использования по-моему конечно же мнению. 1. Название класса в виде snake_case (название с маленькой буквы разделенные нижним подчеркиванием), само название человеко понятное с префиксами идентифицирующие человека написавшего код. .bt_topban_title 2. Отступы между классами, открывающая фигурная…