Tabs Demo Styling

Hi, I want to achieve the styling on the Tabs like how it is in the demo:

https://blazor.syncfusion.com/demos/tabs/default-functionalities?theme=fabric&_ga=2.154742392.1905758828.1624982359-613613506.1623179253


Question:

How to achieve the same styling in the demo which underlines the active tab and removes the default tab borders?




Thank you


1 Reply

SK Satheesh Kumar Balasubramanian Syncfusion Team July 8, 2021 11:38 AM UTC

Hi Kenney, 
  
Thanks for using Syncfusion Products. 
  
We have validated your reported query "Tabs Demo Styling" at our end. We suggest you use material and fabric theme to achieve your requirement. For the same we have prepared a sample for your reference which can be downloaded from the following link. 
  
  
Material: 
  
 
Fabric: 
  
 
_Host.cshtml:  
<head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 
    <title>WebApplication1</title> 
    <base rel='nofollow' href="~/" /> 
    <link rel="stylesheet" rel='nofollow' href="css/bootstrap/bootstrap.min.css" /> 
    <link rel='nofollow' href="css/site.css" rel="stylesheet" /> 
    <link rel='nofollow' href="WebApplication1.styles.css" rel="stylesheet" /> 
    <link rel='nofollow' href="_content/Syncfusion.Blazor.Themes/fabric.css" rel="stylesheet" /> 
</head> 
  
Kindly try the above sample and let us know if this meets your requirement. 
  
Regards, 
Satheesh Kumar B 



Loader.
Up arrow icon