Log in

View Full Version : How Do You Make Border Rounded With CSS3?



dennis123
08-03-2017, 03:15 AM
How Do You Make Border Rounded With CSS3?

crackersguru
08-03-2017, 06:26 AM
Yes, in CSS3, there is a <border-radius> property which allows creating an element with rounded corners. We can apply the same style to all the sides and make the corners round.

The <border-radius> property has four individual properties <border-top-left-radius>, <border-top-right-radius>, <border-bottom-left-radius> and <border-bottom-right-radius>.

Sherin
03-29-2019, 02:15 AM
By border-radius any element can be given rounded corners.
Following is the syntax :
border-radius: 10px; or border-radius: 50%;
where 0px for min and 100px for max rounded corners. And 50% for complete circle and using % is better than px.
The border-radius property is shorthand property for the border-top-left-radius, border-top-right-radius, border-bottom-right-radius and border-bottom-left-radius properties.