Flexible ellipses

Simple ellipse

1. To create a circle simply add border-radiusproperty on the element.

Change on the X and Y axis

1. We can specify diferent value for horizontal and vertical axis.
2. on border-radiusthe first parameter will move the radius on the X axis and the second parameter on the Y axis.
3. The parameters are separate by /.

Modify each corners

1. We can if we want modify each of the corners of an element.
2. On border-radiusproperty use 4 parameter to specify each corners.
3. The first parameter is equal to border-top-left, the second to border-top-right, the third to border-bottom-rightand the last to border-bottom-left.

Modify each corners on differents axis

1. We can combine the method above to create this kind of ellipse.
2. On border-radius use the /separator to modify the X and Y axis.
3. The parameters on the left will modify the corners that you indicate on the X axis.
4. The parameters on the right will modify the corners taht you indicate on the Y axis.