oval shape to input text box

How can we create oval shape to the text box. I have tried giving, border-radius:20px,( which was working for buttons), but this is not working for input fields. What is the way to give oval shape to text box plz?  
2 answers

Hi Bhuvaneshwari,


You where on the correct path with border radius. To give an oval shape to a text box add this css to the custom-variables.scss: 




border-radius: 50%;

border: 2px solid #609;

padding: 20px;

width: 200px;

height: 15px;



Ofcourse you can edit these properties anyway you like. Then add the Ellipse-box class to a text field.


I got the css code from this site: https://codepen.io/udc10/pen/RwwXamd

Hope this helps!


Hi Arkala , You can create a custom css file and put your css code there and @import in the main.scss your file.  Then in the studio pro , you can write in class field your class name and you can have it.