If you want draw a circle then you can use Html-5 Canvas programming or raphael.js or paper.js. But if you want place elements in a Circle then you have to generate coordinates for the Circle. In this article I am going to draw circle with Midpoint Circle algorithm. Find more about Midpoint circle algorithm at http://en.wikipedia.org/wiki/Midpoint_circle_algorithm

### CSS :

```#circle {
position:relative;
margin:auto;
width:400px;
height:400px;
vertical-align:center;
}

#circle b {
position:absolute;
color:rgb(91,111,135);
}
```

### jQuery :

x0, y0 : Center of the Circle
radiusError : This is to calculate value for X - Coordinate.
x, y : Variables to calculate Coordinates.

```  var x0=200,y0=200;
var x = radius, y = 0;

while(x >= y)
{
drawPixel(x + x0, y + y0);
drawPixel(y + x0, x + y0);
drawPixel(-x + x0, y + y0);
drawPixel(-y + x0, x + y0);
drawPixel(-x + x0, -y + y0);
drawPixel(-y + x0, -x + y0);
drawPixel(x + x0, -y + y0);
drawPixel(y + x0, -x + y0);

y++;
else
{
x--;
}
}

function drawPixel(mx,my) {
\$("#circle").append("<b style='left:"+mx+"px;top:"+my+"px'>.</b>");
}
```