Skip Navigation LinksHome > Categories > Code from a Category

Creating a Circle using CSS

User Name: codelecturer
Name: Mike Chauhan
Contact Me:
Home Page:
6 years of total IT experience including programming, application development, System Maintenance . 3 years of Experienced and expertise in .Net Framework VB, Visual Basic.Net, ASP.Net 2.0, 3.5 and AD... [More]
Viewed Times: 1981
Add Date: 04/27/2012
Here i am going to share a very nice and cool css effect. Creating circles with css. Is it that amazing. I have tested it in mozilla firefox and chrome browsers. and it works fine.
Creating a circle in CSS3. This is pretty awesome write... and its simple too. Anybody who knows basic css can do this. hope every one will try this.

Objective of this article is to create a circle with css

Using the code
First thing is that you need to create a division in your webpage. Just using the

Next is our css
The css is so simple. we are going to use the border-radius property in css3.

Note: the height and width should be equal.

Now jus add the css class

The circle is ready.

Conclusion so just think how easy this thing is. Hope this will help the web designers out here.

Happy Coding

Post a Comment

Name: (Optional)
Email: (Optional, you can get an email if somebody replys your comments)*
Email me if somebody respons my comment below:
Enter Text
as Below:
(case insensitive, if hard to read, click the "get a new one" button)
* Your email address will not be shared with any third parties for any reason.
** Maximum 1000 charactors.