Textbox e-corner not working

[Robert Darabana]

Hello, I want to make my text box to be rounded corner.

<div class="wrap">

<div class="e-input-group e-corner">

<input class="e-input" type="text" placeholder = "Enter Date"/>

<span class="e-input-group-icon e-input-popup-date" >span>

div>

div>

This is my code. e-corner class is not working.

How i can make my Input text box to be corner rounder? Also e-input-group-icon is not showing, I dont know why.. Thanks

[Ponmani Murugaiyan]

Hi Robert, 

You can make the rounded corner for TextBox component using bootstrap theme in which the textbox has all borders, by overriding the below styles you can achieve your requirement. 

Sample: https://stackblitz.com/edit/angular-txaqnm?file=app.component.ts 

[Index.html] 

<link rel='nofollow' href="//cdn.syncfusion.com/ej2/bootstrap.css" rel="stylesheet" /> 

[app.component.css] 

input.e-input, 

.e-input-group input.e-input, 

.e-input-group input, 

.e-input-group.e-control-wrapper input.e-input, 

.e-input-group.e-control-wrapper input, 

.e-float-input input, 

.e-float-input.e-input-group input, 

.e-float-input.e-control-wrapper input, 

.e-float-input.e-control-wrapper.e-input-group input, 

.e-input-group, 

.e-input-group.e-control-wrapper, 

.e-float-input, 

.e-float-input.e-control-wrapper { 

  border-radius: 10px; 

} 

[Output] 

 

Regards, 

Ponmani M