Tabsheet vaadin style not working

Support
#1

Trying to remove padding inside the tabs content.

Defined the following css in styles.css

vaadin-tabs::part(content) {
    padding: 0px !important;
    margin: 0px !important;
    background-color: red;
    border-bottom-left-radius: inherit !important;
    border-bottom-right-radius: inherit !important;
}

While it works in the Jmix 2.1 studio designer (the space is removed), it is not working in chrome. Any idea why ?

#2

Hi,

Have you tried all of the following?

  • Check if style is overriden in browser dev tools
  • Hard refreshing page to reload the styles
  • Check if styles are applied in another browser

Regards,
Alex

#3

Hi Alex,

I did a hard refresh as well as tried on Safari and Firefox, the issue is still the same.

In the browser devtool, I see the style defined for the element vaadin-tabsheet-scroller.

#5

Please provide a sample project so i can run it quickly and check the issue

#7

The element you need is: vaadin-tabsheet::part(content)