tomorrow tomorrow - 4 months ago 50
CSS Question

How to only change left padding in javafx css

I've used html+css quite a lot but I'm completely new to javafx+css. So this will be a newbie question but I can't find the answer anywhere.

I have a large GridPane full of Labels (besides others). I can set padding for all these Labels like:

GridPane.containerLevel02 Label {
-fx-padding: 0 0 0 5;
}


This works. I want some of the labels to be more indented so I create the "leftIndent" class for them:

GridPane.containerLevel02 Label.leftIndent {
-fx-padding: 0 0 0 20;
}


This works too.

BUT, I don't want to specify the three zeros there because if I ever decide to add top/bottom padding to Labels in general, it will not affect the "leftIndent" labels.

What I'm looking for is something like:

GridPane.containerLevel02 Label.leftIndent {
-fx-padding-left: 20;
}


... like in "normal" CSS or ...

GridPane.containerLevel02 Label.leftIndent {
-fx-padding: null null null 20;
}


...or anything that would let me specify left padding leaving the top, right and bottom padding untouched with whatever values they currently have.

Is that possible? THANKS!

Answer

Since JavaFX does not provide a -fx-padding-left or similar, I think your easiest workaround is to use variables. For instance:

.root {
  LABEL_PADDING_TOP: 0;
  LABEL_PADDING_RIGHT: 0;
  LABEL_PADDING_BOTTOM: 0;
  LABEL_PADDING_LEFT: 5;
}

GridPane.containerLevel02 Label {
    -fx-padding: LABEL_PADDING_TOP LABEL_PADDING_RIGHT LABEL_PADDING_BOTTOM LABEL_PADDING_LEFT;
}

GridPane.containerLevel02 Label.leftIndent {
    -fx-padding: LABEL_PADDING_TOP LABEL_PADDING_RIGHT LABEL_PADDING_BOTTOM 20;
}

It still requires you to override all values which can be unwanted in certain use cases, but at least you have to specify your defaults only at one place.