Search code examples
jquerycssjsf-2primefaces

Primefaces menubar's submenu & elements width

I've a primefaces menubar on top of my page and I tried to increase the submenus width to fit the menu-items text but it's not working.

This is a screenshot of my menu :

Menu Childs

how can I increase the submenu width to fix the text.

Thanks.

Solution

  • Try this css rule. Change width to whatever you require. 

    ul.ui-widget-content.ui-menu-list.ui-menu-child {
   width: 200px;
}

    Note this will stuff up other styles e.g

    .ui-menubar .ui-menu-child .ui-menuitem-link {
    width: 92%;
 }

    You may need to change this too.