Change style

[AYMEN Matador]

Hi,

I appreciate if anyone can help me change the bottom line color of a tab component as illustrared below.

Thanks

[lorryl]

.e-tab .e-tab-header .e-indicator {

1. background: red;

}

[Satheesh Kumar Balasubramanian]

Hi Aymen, 

  

Thanks for using Syncfusion Products. 

  

We have validated your reported query "change the bottom line color of tab component" and suggest you to use the below customized style to achieve your requirement. Please find the sample in the following link. 

  

Sample: https://stackblitz.com/edit/angular-tab-indicator-color?file=app.component.css 

  

app.component.html:  

 <ejs-tab id="tab_default" heightAdjustMode="Auto" [cssClass]="tabClass"> 

........
 </ejs-tab> 

  

app.component.ts:  

public tabClass: string = 'tab-class'; 

  

app.component.css:  

.e-tab.tab-class .e-tab-header .e-toolbar-items .e-indicator { 

  background: blue; 

} 

  

 

Kindly try the above solution and get back to us if you need any further assistance.
 

  

Regards, 

Satheesh Kumar B 

[AYMEN Matador]

Thanks a lot. Both answers meet my needs perfectly.

Best Regards.

[Nevitha Ravi]

Hi Aymen, 

You are most welcome..! We are glad that our solution helped you, please get back to us if you need any further assistance. 

Regards, 

Nevitha