Home Home Creating Triangles And Circles Using CSS

Creating Triangles And Circles Using CSS

triangle-circle-css

In this post I will show you how to create triangles and circles using CSS only.

Circle is created by providing border-radius 50% of the height or width of div. For circle height and width should be equal.

Triangle has three sides therefore we take three borders and provide width to them. One border forms the actual triangle so we make other two invisible. Don’t forget to make the height and width to 0px.

Narayan Prusty
HTML5 Form Placeholder AttributeHorizontal and vertical Centering Using CSS

Leave a Reply

To create code blocks or other preformatted text, indent by four spaces:

    This will be displayed in a monospaced font. The first four
    spaces will be stripped off, but all other whitespace
    will be preserved.
    
    Markdown is turned off in code blocks:
     [This is not a link](http://example.com)

To create not a block, but an inline code span, use backticks:

Here is some inline `code`.

Narayan Prusty

I am a full-stack web developer. I specialize in Blockchain and JavaScript. This is my personal blog where I write about programming and technologies that I learn and feel interesting to share.

Image5 years ago Web Development
Share this
Related Articles