CSS border-top-left-radius property

Property values

+XY-length (in px)Default

0

It means the length of both horizontal and vertical radii is 0 for top-left corner.

border-top-left-radius: 0px;

Try it { }

+XY-length (in percentage)

30

The length of the horizontal and vertical radii is 30% for top-left corner.

border-top-left-radius: 30%;

Try it { }

X-radius Y-radius (in px)

The length of horizontal and vertical radii is 40px and 20px respectively for top-left corner.

border-top-left-radius: 40px 20px;

Try it { }

X-radius Y-radius (in percentage)

50

The length of horizontal and vertical radii is 30% and 50% respectively for top-left corner.

border-top-left-radius: 30% 50%;

Try it { }