Creating a curved list in html without canvas

Question

I want to create a curved list as shown below using jquery and css.

How to do it.

I tried with conversion but did not work. How to reach or use any jquery library.

Answer 1

You can use the property css3 border-radiusto draw curves. If you need complex curves, just create some elements and add them together.

I found this jsfiddle on the web. He hopes this will serve your needs. jsfiddle

If you need something more specific, you may need to indicate your question.

Regards

Answer 2

, -

<div id="curves" class="width">
    <div id="curve1"></div>
    </div>
   <div id="one">a</div>




 #curves div {
    margin-top: 100px;
    width: 400px;
    height: 400px;
    border: 5px solid #999;
}


#curves.width div {
    border-color: red red  transparent transparent;
    /* top right bottom left */
}



#curve1 {
    border-radius:  100% 100% 100% 0;
}


#one {
    position: absolute;
    left: 300px;
    top: 105px;
}

, Fiddle, , , java- script/jquery

,