В общем возник вопрос по реализации так называемого “кривого” бэкграунда на странице.
Верстал себе, верстал и тут наткнулся на “китчен-мастер” из рассылки и задался как правильно реализовывать подобные “финты” с неровным фоном?
В общем возник вопрос по реализации так называемого “кривого” бэкграунда на странице.
Верстал себе, верстал и тут наткнулся на “китчен-мастер” из рассылки и задался как правильно реализовывать подобные “финты” с неровным фоном?
Вот неплохой пример: http://pcvector.net/scripts/layout_and_interface/242-skoshennye-elementy-na-css3.html
По крайней мере очень похоже на то, что необходимо вам.
Вот еще: http://codepen.io/cleric/pen/WvRBpP
Еще варианты будут?
Мне например легче реализовать это все с помощью псевдокласса before/after вставив эту срезанный треугольник :))
Интересует мнение тех, кто верстал данный макет ибо он из рассылки Самый жесткий вариант конечно это тупо цельной картинкой.
Еще наверно можно псевдоклассом, но не срезанный треугольник, а обычный прямоугольный блок немного наклонить transform: totate(45deg)
Дело в том, что если наклонять прямоугольный блок допустим при 100% ширине, то появляется не совсем ровный срез по бокам, а с огрызками в цвет основного фона, что в этом случае? Вот на скрине видны проушины в цвет фона (черный).
А если ему размер больше сделать? А блоку-родителю задать overflow: hidden;
Попробуй темный крутить, а под ним залей тем же цветом. Не будут края видны