Basic Geometric Shapes in pure CSS

Here are a couple of examples of how to create basic geometric shapes by using nothing but pure css. Square +      ```css .square { width: 100px; height: 100px; } ``` Circle +      ```css .circle { width: 100px; height: 100px; -moz-border-radius: 50px; -webkit-border-radius: 50px; border-radius: 50px; } ``` Oval +      ```css .oval { width: 160px; height: 100px; -moz-border-radius: 80px / 50px; -webkit-border-radius: 80px / 50px; border-radius: 80px / 50px; } ``` Triangle Up +      ```css ....

May 28, 2012 · 2 min · ArtBIT