QNimate

  • CoursesVideos
  • WP PremiumPlugins
  • DemosLab
  • Home
  • QIdea
  • QTrack
Home Carbon Ads 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.

Jun 22, 2014Narayan Prusty
HTML5 Form Placeholder AttributeHorizontal and vertical Centering Using CSS

Leave a Reply Cancel 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`.

For more help see http://daringfireball.net/projects/markdown/syntax

Narayan Prusty

I am a software engineer specialising in Blockchain, DevOps and Go/JavaScript. This is my personal blog where I write about things that I learn and feel interesting to share.

Image8 years ago Web Development
Share this
0
GooglePlus
0
Facebook
0
Twitter
0
Linkedin
Related Articles
  • Sidebar for Phonegap App
  • HTML Textarea Fixed Size
  • Horizontal and vertical Centering Using CSS
  • Creating A Sticky Header
  • How To Detect Element Entered Viewport
Our Sponsor
My Books

2014 - 2015 © QNimate
All tutorials MIT license