I am trying to make one circle inside of another circle using css, but I am having an issue making it completely centered. I am close, but still not there. Any ideas?
<div id="content">
<h1>Test Circle</h1>
<div id="outer-circle">
<div id="inner-circle">
<span id="inside-content"></span>
</div>
</div>
</div>
Here is my CSS:
#outer-circle {
background: #385a94;
border-radius: 50%;
height:500px;
width:500px;
}
#inner-circle {
position: relative;
background: #a9aaab;
border-radius: 50%;
height:300px;
width:300px;
margin: 0px 0px 0px 100px;
}
Also, here is a fiddle: http://jsfiddle.net/972SF/
left: 100px; top: 100px;
. – putvande Mar 14 '14 at 13:42