Uday
Uday

Reputation: 161

Custom icon for menu item on prime faces

I have to add customized icon for menu item. please any one suggest me? I have set the icon using CSS class but am not getting displaying.

<p:submenu label="Administration" >
    <p:menuitem value="Role Master" url="/secured/role_master.xhtml?redirect=true" />
    <p:menuitem value="Role Assignment" url="#" />
    <p:menuitem value="User Management" url="/secured/users.xhtml?redirect=true" icon="user"/>
</p:submenu>

and below code represent css class

.user{
    background: url('resources/images/menu/users.png') no-repeat;
    height:16px;
    width:16px;
}

Upvotes: 5

Views: 5841

Answers (2)

John Taylor
John Taylor

Reputation: 143

try this:

.user{
    background-image: url('resources/images/menu/users.png') !important;
    height:16px;
    width:16px;
}

Upvotes: 3

Arun Raj
Arun Raj

Reputation: 243

try this...

      .tabmenubutton
        {
         background:url("common/images/calendar.png") no-repeat !important;
         width:20px;
         height:20px;
        }

xhtml:

      <p:menuitem value="Country" icon="tabmenubutton"/>

Upvotes: 0

Related Questions