How to reduce the width of Primefaces <p:menubar>

Question

I'm trying to reduce the width of the <p:menubar> in primefaces. By default, it covers the whole screen with but I want to reduce that. I've tried using css "width: 70%;" but still not working. Does anyone knows the way out?

Answer 1

Give you menubar an exclusive class (lets say my-70-pc-menu) to avoid every manubar to be 70% and than change your css file to place this:

.my-70-pc-menu{
    width: 70% !important;  
}