Positioning divs in a circle using CSS.

<style type="text/css">

.circle{
   position:relative;
   width:5%;padding-bottom:50%;
   margin-left:47.5%;
}
.circle div {
   position:absolute;
   top:0; left:0;
   width:100%; height:100%;
   -webkit-transform : rotate(24deg);
   -ms-transform : rotate(24deg);
   transform : rotate(24deg);
}
.circle:before, .circle div:before {
   content:'';
   position:absolute;
   top:0; left:0;
   width:100%; padding-bottom:100%;
   border-radius: 100%;
   border: 2px solid teal;
   background:gold;
}

</style>


<div class="circle">
    <div><div><div><div><div><div><div><div><div><div><div><div><div><div><div>
    </div></div></div></div></div></div></div></div></div></div></div></div></div></div></div>
</div>


Output :)