JavaFX: How to define margin to TextField in css?

Question

Is it possible to define padding and margin for TextFields in JavaFX using CSS? I have tried -fx-padding and some other properties, but no effect. I am using JavaFX 2.2 which is included in the latest version of Java 7.

I have many textfields and doing something like:

    <GridPane.margin>
        <Insets bottom="10.0" left="60.0" right="0.0" top="10.0"/>
    </GridPane.margin>

after each textfield is not a good solution for me.

Answer 1

Modified copy from Confgure margin for individual element via java fx css

Theres no -fx-margin:5px css property for javafx textfields, but you can workaround the behaviour with a combination of padding, border-insets and background-insets.

For example a text-field with a 5px margin.

.text-field-with-margin {
    -fx-padding: 5px;
    -fx-border-insets: 5px;
    -fx-background-insets: 5px;
}

Alternatively you can also define a higher padding and lower insets values in case you want a padding and a margin.

Answer 2

TextFields in JavaFX have the CSS class text-field.

You can define the following rule:

.text-field {
   ....
}

But I think that you want to create some spacing around the fields, right? Sadly, there is no margin property for TextFields.

I usually define a padding for the wrapping Control. In this case you would define a padding for all GridPanes.

For more information please have a look at the JavaFX CSS reference.

Answer 3

Preferred to use CSS to much more easier design a gui in your javafx.

#idTextField{
  -fx-padding: 5 5 5 5;
}