17-Peridot

Solved

Widget Specific CSS - Tabs

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

Best answer by PEHOWE

@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

P

Answer

17-Peridot

@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

S

Author

17-Peridot

Thanks @PEHOWE Its working great.

Sign up