We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Tab issues


I need a help to fix this issue in the attached screen shot (demo), its a popup having a field name Template & My Questions it should be  centre aligned and First Letter should be in Caps remaining should be in small, Kindly find the attached screenshot for your reference (mockup)



Attachment: screenshot_8723b0e5.zip

3 Replies

VD Vinitha Devi Murugan Syncfusion Team August 29, 2019 02:06 PM UTC

Hi Sunithra, 

Syncfusion greetings. 

We had prepared the sample based on your requirement which is available from below link: 

Kindly check the sample and revert us, if you need any further assistance on this. 


SU sunithra August 29, 2019 02:33 PM UTC


Thanks for your reply regarding capital letters & small letter, but regarding tab centre alignment issue we couldn't get the solution from your side,So again i mark and send the sample mock which i need exact solution with sample code. 

Attachment: demoProjectdemoScreenshot_438b2a20.zip

VM Vengatesh Maniraj Syncfusion Team August 30, 2019 10:03 AM UTC

Thanks for the update. 

We have covered the tab centre alignment also in below provided sample. We can achieve this case by overriding tab css classes like below code snippets. 

Sample: https://stackblitz.com/edit/angular-ghgpdk-ljwpqj?file=app.component.css                                                                                                                                                                                  

#1: Capital & small letter 
.e-tab .e-tab-header .e-toolbar-item .e-tab-text {
text-transform: capitalize !important;

#2: Tab centre alignment 
#tab_default .e-tab-header .e-toolbar-items {
width: inherit;
#tab_default .e-tab-header .e-toolbar-item:not(.e-separator){
width: calc(100%/3);
#tab_default .e-tab-header .e-toolbar-item .e-tab-wrap {
text-align: center;
Output like below, 
Kindly check the sample and revert us, if you need any further assistance on this. 

Live Chat Icon For mobile
Up arrow icon