How can I make the green shape in the photo in css. It is to make the game simon says.Thanks !!
I could use border-top-left-radius to round off the left edge, but how do I achieve the rounded shape of the lower right side?
What you can do is, instead of coloring the div
, assign it an edge of the same size as the div
that you have created and assign a color to it. In this way, you will have the top edge rounded at the same time as the bottom edge.
You have to bear in mind that you will have to assign the edge depending on the section of the circle you are referring to. For example, in this case you would have to assign them above and to the left ( border-top
and border-left
respectively).
Example:
#curvo{
height: 100px;
width: 100px;
border-top: 100px green solid;
border-left: 100px green solid;
border-top-left-radius:100%;
}
<div id="curvo"></div>