I want to create a shape like the uploaded image wiht css. Please let me know how to do this.
Thanks
It's not difficult. You create a circle within a wrapper that clips out what you don't need.
HTML:
<div class='shape-wrap'>
<div class='shape'></div>
</div>
Relevant CSS:
.shape-wrap {
overflow: hidden;
width: 32em; height: 8em;
}
.shape {
box-sizing: border-box;
margin: -175% -50%;
width: 200%; height: 800%;
border: solid 2em dodgerblue;
border-radius: 50%;
box-shadow: inset 0 0 .5em .25em dimgrey;
}