JavaFX: Inline statement and CSS ID

This entry is part 45 of 55 in the series JavaFX

As you know, we have always used ID in CSS to style an element.  We will work out an example that uses a defined ID and an inline statement to style a Label.

Inline statement allows us to use CSS syntax which can be quite handy if we want to style an element with only some minor modifications.

In the style.css, I have also made some changes to the List View on its odd and even cells.  Note that cells in List View are identified by list-cell.

.list-cell:odd {

.list-cell:even  { 
    -fx-background-color: darkkhaki;

#hboxid {
    -fx-background-color: lightblue;
    -fx-padding: 20;
    -fx-spacing: 10;

Consider the following example.

package javafxapplication29;

import javafx.application.Application;
import static javafx.application.Application.launch;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.ListView;
import javafx.scene.layout.HBox;
import javafx.stage.Stage;

public class JavaFXApplication29 extends Application {

    public void start(Stage stage) {

        stage.setTitle("JavaFX Program!");

        ListView<String> lv = new ListView<String>();

        ObservableList<String> items = FXCollections.observableArrayList(
                "Rock", "Country", "Pop", "Rap");

        int row_height = 24;  //default row height

        lv.setMaxHeight(items.size() * row_height);

        HBox hbox = new HBox(10); // spacing = 10           

        Label lb = new Label("Selection:");
        lb.setStyle("-fx-font-size: 15pt; -fx-background-color: lightblue; -fx-effect: dropshadow(one-pass-box, black, 8, 0.0, 2, 0 );");

        hbox.getChildren().addAll(lb, lv);

        Scene scene = new Scene(hbox, 450, 300);


    public static void main(String[] args) {


Series Navigation<< JavaFX: Applying CSS styles to individual elements
JavaFX: Creating A Circle >>

Leave a comment

Leave a Reply