draw a rectangle with round edge and border? | Sololearn: Learn to code for FREE!
New course! Every coder should learn Generative AI!
Try a free lesson
+ 2

draw a rectangle with round edge and border?

13th Jul 2016, 6:19 AM
Rajesh kumar
Rajesh kumar - avatar
4 Answers
+ 4
then you code this for CSS : #rcorners1 { border-radius: 25px; background: #73AD21; padding: 20px; width: 200px; height: 150px; }
14th Jul 2016, 1:37 PM
Awele Omeligwe
Awele Omeligwe - avatar
+ 3
if you want a round edge rectangle,: HTML code: <div id="rcorners1">This Div is Round</div>
14th Jul 2016, 1:37 PM
Awele Omeligwe
Awele Omeligwe - avatar
+ 3
but for svg : <svg width="400" height="180"> <rect x="50" y="20" rx="20" ry="20" width="150" height="150" style="fill:red;stroke:black;stroke-width:5;opacity:0.5" /> </svg>
14th Jul 2016, 1:39 PM
Awele Omeligwe
Awele Omeligwe - avatar
+ 2
The x attribute defines the left position of the rectangle (e.g. x="50" places the rectangle 50 px from the left margin) The y attribute defines the top position of the rectangle (e.g. y="20" places the rectangle 20 px from the top margin). The rx and the ry attributes rounds the corners of the rectangle.
14th Jul 2016, 1:43 PM
Awele Omeligwe
Awele Omeligwe - avatar