CODEWITHSUNDEEP
javacssjavafxjavafx-2javafx-8
CTN
CTN

Reputation: 334

CSS for shape does not apply on textarea in javafx

I am applying following CSS.

.text-area .content {
    -fx-background-color: -lined-back;
    -fx-shape: "M 7 0 L 24 0 L 24 19 L 0 19 L 0 2 L 7 2 Z";
}

.text-area:focused .content {
    -fx-shape: "M 7 0 L 24 0 L 24 19 L 0 19 L 0 2 L 7 2 Z";
}

My problem is it's only changes shape of background not whole component.and also start editing at starting point.as per below image. enter image description here

Upvotes: 1

Views: 421

Answers (1)

willanderson
willanderson

Reputation: 1578

Do you have the HTML these styles apply to? I know nothing about javafx, but you are currently targeting .content inside of .text-area. You probably just need to target the .text-area itself:

.text-area,
.text-area .content {
    -fx-background-color: -lined-back;
    -fx-shape: "M 7 0 L 24 0 L 24 19 L 0 19 L 0 2 L 7 2 Z";
}

.text-area:focused,
.text-area:focused .content {
    -fx-shape: "M 7 0 L 24 0 L 24 19 L 0 19 L 0 2 L 7 2 Z";
}

You may even be able to only target the .text-area, since I would imagine its children would be constrained by its shape.

.text-area {
    -fx-background-color: -lined-back;
    -fx-shape: "M 7 0 L 24 0 L 24 19 L 0 19 L 0 2 L 7 2 Z";
}

.text-area:focused {
    -fx-shape: "M 7 0 L 24 0 L 24 19 L 0 19 L 0 2 L 7 2 Z";
}

Upvotes: 1

Related Questions