css - How to draw cross diagonal lines without using SVG or HTML Canvas -
how draw cross diagonal lines without using svg or html canvas ?
my tutor hope use simple css make it.
here's 2 diagonal lines forming x using css , 1 element.
.x { width: 100px; height: 100px; position: relative; } .x::before, .x::after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; border-right: 1px solid #000; } .x::before { transform: rotate(45deg) translate(-50px, 0); } .x::after { transform: rotate(-45deg) translate(-50px, 0); }
<div class="x"></div>
Comments
Post a Comment