Posts

Showing posts from November, 2023

Create Shape With CSS

Image
Copy following code: https://bennettfeely.com/clippy/ https://sharkcoder.com/visual/shapes   <! DOCTYPE html > < html > < head > < style > :root {   --arrow-shape : polygon ( 0 0% , 77% -37% , 105% 40% , 100% 101% , 70% 100% , 30% 100% , 0 100% , 0% 30% ); } .parallelogram-outline {   display : inline-block ;   background-color : black ;   clip-path : var ( --arrow-shape );   border : 0.1px solid black ; /* Add a border with a width of 0.1 units to the parallelogram outline */ } .parallelogram {   font-family : sans-serif ;   background-color : #534686 ;   padding : 0.25rem 0.75rem 0.25rem 0.5rem ;   clip-path : var ( --arrow-shape );   border : 0.1px solid black ; /* Add a border with a width of 0.1 units to the parallelogram */ } </ style > < title > Page Title </ title > </ head > < body > < div class = "parallelogram-outline" >   < div class...