Search code examples
cssjavafxstyling

How to remove border on JavaFX TabPane?

I have this css styling for tabpane javafx:

.tab {
-fx-background-color:  #002f6c;
}

.tab-pane>*.tab-header-area>*.tab-header-background
{
-fx-background-color: -fx-outer-border, -fx-text-box-border, #002f6c;
}

.tab:selected {
-fx-background-color:  #0041a0;
}
.tab-label {
-fx-text-fill: #ffffff;
}

.tab-pane:focused > .tab-header-area > .headers-region > .tab:selected .focus-indicator 
{
-fx-border-radius: 0px;
-fx-border-width: 0px 0px 0px 0px;
-fx-border-color: #4d1a4dff;
}

But i still can't rid of this white border near my tabs: enter image description here

Can somebody help me with it?

Solution

  • The white border effect is because of the background color insets applied on .tab-header-background. Modifiying the code below should do the trick.

    .tab-pane>*.tab-header-area>*.tab-header-background {
  -fx-background-color: #002f6c;
  -fx-background-insets:0;
}