Widget Specific CSS - Tabs

[Sathishkumar_C]

In some way, I want to hide the tab header using CSS. When using CSS, it works properly.

In my single mashup, I have two tab widgets, and the CSS is applied for two tab widgets.

I want apply below CSS with widget specific.

.widget-ptcstabset::part(tabs-header){
    display: none;
}

How to apply CSS without affecting more than one tab widget? 

Note: Thingworx 9.1

[PEHOWE · Accepted solution]

@Sathishkumar_C,

you need to know the ID of the tabset you want the CSS to affect. In my test case I had a tabset with an ID of "ptcstabset-9" and ptcstabset-16"

Using your CSS from above I created:

#root_ptcstabset-9.widget-ptcstabset::part(tabs-header){
   display: none;
}

The "#" character followed by the ID of the element identifies the specific element. I have placed my sample below.

#root_ptcstabset-9.widget-ptcstabset::part(tabs-header){
   display: none;
}

Hope that helps.

Peter

[Sathishkumar_C]

Thanks @PEHOWE Its working great.