Hi all,

I want to style a single menubutton, especially the background color. First try: Used the backgroundColor-Attribute of the menuButton. That works fine - as long as i keep the mouse away. When hovering with the mouse cursor, the button highlights - in a color that i do not want. Next try: Created a css styleclass and applied it to the button. Works also fine - as long as i keep the mouse away. When hovering, a different styleclass (bdf-button-over) is triggered.

I know, i can overwrite this default-styleclasses with my own settings, but I do not want to, because this settings are fine for the rest of the application. I just want to apply other styling to this one menubutton, how can i achieve this? Is there any chance to set my own styleclasses for the different button status?

Ah, by the way, how can I do the same for the popupmenu i open with this menubutton? The popupmenu and the menuitems do not even have a styleClass attribute!

In HTML this would take minutes, with CSS or without. How can I do so in Formspider, does anybody have an idea?

Cheers, Marius

asked 02 May '14, 08:57

Marius's gravatar image

accept rate: 0%

Hi Marius,

You can add new styles to override existing settings just for only one button. For example, if you want to change hower background color of a button to red, you can simply add the following lines to css file.

#button1-mainPanel.bdf-button-over {
  background: none repeat scroll 0 0 #FF0000;

button1 = name of the button
mainPanel = name of the panel



answered 02 May '14, 09:25

Serdar's gravatar image

Serdar ♦♦
accept rate: 12%

Ah perfect. Thank you very much Serdar. I have to get deeper into this CSS things to understand all this extending and inheriting.


(02 May '14, 09:41) Marius
Your answer
toggle preview

Follow this question

By Email:

Once you sign in you will be able to subscribe for any updates here



Answers and Comments

Markdown Basics

  • *italic* or _italic_
  • **bold** or __bold__
  • link:[text](http://url.com/ "title")
  • image?![alt text](/path/img.jpg "title")
  • numbered list: 1. Foo 2. Bar
  • to add a line break simply add two spaces to where you would like the new line to be.
  • basic HTML tags are also supported



Asked: 02 May '14, 08:57

Seen: 116,171 times

Last updated: 02 May '14, 09:41

© Copyright Gerger 2017