CODEWITHSUNDEEP
javavaadinvaadin7
FernandoPaiva
FernandoPaiva

Reputation: 4462

Working with css on vaadin?

I'm reading the chapter 8 on book of vaadin and I cannot understand how define a css style for each components. I did the customization on styles.scss but all customization went to all components and I don't wanna this.

example

HorizontalLayout hLayout = new HorizontalLayout();
HorizontalLayout hMainLayout = new HorizontalLayout();

I want that hLayout has a background image and hMainLayout no has.

I try this, but not work.

.v-horizontallayout-hLayout {
     background:url("myimage.jpg");
}

.v-horizontallayout-hMainLayout {
     background: none;
}

Any idea ?

Upvotes: 2

Views: 1436

Answers (2)

nexus
nexus

Reputation: 2937

I want to add something little to users 'default locale' answer:

There's also a method called addStyleName(String) which is in some cases better especially when you don't want to replace any previous user-defined styles.

BTW: You can apply more than one styles with setStyleName(String) / addStyleName(String) by invoking it like this:

hLayout.setStyleName("aLayout bLayout cLayout"); // replaces any previous styles
hLayout.addStyleName("dLayout eLayout fLayout"); // add styles without any replacement

Upvotes: 5

default locale
default locale

Reputation: 13456

Vaadin doesn't define styles based on java variable names.

You can use Component.setStyleName to apply custom style name to your component:

HorizontalLayout hLayout = new HorizontalLayout();
hLayout.setStyleName("hLayout");

Then you can match style v-horizontallayout-hLayout

Upvotes: 4

Related Questions