dropDownMenu or menuItem style question

[charlesyang]

Hello,

The default dropDownMenu will show list of rich:menuItem with a vertical blue bar on the left, takes lot of space. Is there any way to get rid off that

vertical bar on the left ? I checked attributes, seems none. How can I over write that CSS somewhere being used by the dropDownMenu or menuItem ?

Thanks.

[akaine]

Option #1: read the RichFaces referece, is has a brief info on element styles. Though there is not much info there.

Option #2 (personal favorite):

- render the page as it is

- select the part with the menubar with cursor

- from browser context menu select View Selection Source (Firefox), or whatever your browser offers

- look for the part with the menus produced html source

- now you can see the real html structure produced, and so you can define some style to the "not generated" elements and run through the DOM to get to the part you actually need to change

Example:

----------------------------------

source:

<div class="myclass"><some_ugly_complex_rf_element/></div>

rendered html:

<div class="myclass">

     <div><table><tr><td><div><span></span></div></tr></td></table></div>

</div>

css:

.myclass table div table tr td div span {some_css_properties;}

Feel the power over this mess!

----------------------------------

Btw, dropDownMenu and menuItem have plenty of their own attributes which allow relatively profound styling so I am not really sure you would need all these brute techniques

[charlesyang]

Thanks lot, I'll try what you suggested.