Search code examples
javaframeworksvaadinvaadin7

OptionGroup horizontal?


I'm trying change an OptionGroup to display Horizontal. In vaadin7 book there an example to change with CSS, but doesn't work.

I'm trying this.

//styles.scss
/** optiongroup */
/* Lay the options horizontally */
.v-select-optiongroup-horizontal .v-select-option {
    display: inline-block;
}
/* Avoid wrapping if the layout is too tight */
.v-select-optiongroup-horizontal {
    white-space: nowrap;
}
/* Some extra spacing is needed */
.v-select-optiongroup-horizontal .v-select-option.v-radiobutton {
    padding-right: 10px;
}


//Here the OptionGroup
OptionGroup optionGroup = new OptionGroup();
optionGroup.addItem("Usuário");
optionGroup.addItem("Representante");

Any idea?


Solution

  • As written in the book you need to set a custom horizontal style name:

    optionGroup.addStyleName("horizontal");