I have a prime vue menubar with 3 tabs that align to the left
HTML
<Menubar :model="items" />
.vue file
export default {
data() {
return {
items: [
{
label:'Users',
icon:'pi pi-fw pi-user',
},
{
label:'Events',
icon:'pi pi-fw pi-calendar',
},
{
label:'Settings',
icon:'pi pi-fw pi-cog'
}
]
}
}
}
I want to move the settings tab to the right how would I do this? I tried adding to below the settings label. There is no examples in the docs
style:{'margin-right': 'auto'}
I know it's a bit late, but just faced this problem today.
One way of doing it would be to set some CSS styles to modify the original .p-menubar-button
and .p-menubar-root-list
:
.p-menubar-root-list, .p-menubar-button {
position: absolute;
right: 0;
}
This will force the items to be on the rigth. But be careful because it does not work if you are using the end
template (or at least for the quick test I did, it was not working).