Css child window style when parent panel has -fx-border-radius in JavaFX

Question

I have two panels - the parent panel and the child panel. The child window is inside the parent window. The parent panel has the following css rules:

-fx-border-color:derive(-fx-background, -35%); -fx-border-width:1; -fx-border-style:solid; -fx-border-radius:4; 

The child panel has the following css rules:

 -fx-background-radius:25; 

And this is one of the angles:

As you can see, the corner is a little pale - I mean, the border with the parents is not very visible in the corner itself (lower left corner). To solve this problem, I added -fx-background-radius:25 to the child, but that didn't help. How to fix this, taking into account that I can not add an addition to the parent or markup for the child?

Answer 1

try adding: -fx-background-radius:4; to your parent panel (same radius as border)

Answer 2

I created a fxml sample based on your problem statement.

I did not do anything special, but worked as expected

Please refer to the fxml file for it.

 <AnchorPane id="AnchorPane" prefHeight="400.0" prefWidth="600.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8"> <children> <Pane layoutX="129.0" layoutY="72.0" prefHeight="300.0" prefWidth="300.0" style="-fx-border-width: 1; -fx-border-style: solid; -fx-border-radius: 4; -fx-background-color: derive(-fx-background, -35%); -fx-background-radius: 4;"> <children> <Pane layoutX="1.0" layoutY="213.0" prefHeight="86.0" prefWidth="298.0" style="-fx-background-radius: 4; -fx-background-color: white;" /> </children> </Pane> </children> </AnchorPane> 

Output: