This discussion is archived
1 Reply Latest reply: Sep 11, 2012 3:54 AM by abg RSS

How to style ChoiceBox (inner menu) with css

911060 Newbie
Currently Being Moderated
Hi all,

I have choice boxes like that:
<ChoiceBox fx:id="cbMaxNumber" prefWidth="130" prefHeight="40" >
        <FXCollections fx:id="liste" fx:factory="observableArrayList">
         <String fx:value="50"/>
            <String fx:value="100"/>
            <String fx:value="500"/>
            <String fx:value="1000"/> 
I can style them with .choice-box {}, .choice-box .label {} ect. I just don't get inside to the menu-items and the hover-color of the menu-items. In caspian.css
I found .choice-box .context-menu {} and .choice-box .menu-item {}, but that doesn't seem to do anything. I also tried several other combinations with items, label, String ect., I also tried it directly e.g. with #liste{}. No matter what I do, there are no changes.

In caspian.css, .choice-box .context-menu {} and .choice-box .menu-item {} don't contain any color-information. So there has to be a different place in caspian.css where the information is given. Does anyone know where this place is? I also tried .menu-item {} and .context-menu{} without choice-box. No difference.

Thanks for reading and any hint!
  • 1. Re: How to style ChoiceBox (inner menu) with css
    abg Newbie
    Currently Being Moderated

    I asked the same question a few weeks ago and did not get a satisfactory answer. However, I solved my problem by setting some of the .root parameters. In root, -fx-accent: controls the colour of the selected or to be selected item.

    The effect of this can be seen in my demonstration at

    Hope this helps



  • Correct Answers - 10 points
  • Helpful Answers - 5 points