Home > Article > Web Front-end > CSS defines a rounded text box, but when it gets focus, it has square corners, which looks ugly_html/css_WEB-ITnose
Defined like this
.grade_text{border-radius:10px;cursor:pointer;text -indent:12px;}
.grade_text:focus{border-radius:10px;cursor:pointer;}
The following are the styles without and with focus
What do you think? When getting focus, let him have rounded corners. I have added .grade_text:focus{border-radius:10px;cursor:pointer;}
outline:none
Try adding this attribute
Remove the outer border.
You defined the rounded text box using css. Then when your text box gets focus, you can also set a rounded border.
outline:none
Try adding this attribute
to remove the outer border.