Primefaces菜单栏垂直分离器

Question

我正在使用PrimeFaces 3.5。 p:toolbar（https://www.primefaces.org/showcase/ui/panel/toolbar.xhtml）中有一个垂直分隔符。

我想在p:menubar中使用垂直分隔符。当我在<p:separator />中使用p:menubar标记时，它会生成一个水平分隔符。

如何在p:menubar中使用垂直分隔符？

感谢。

Answer 1

我是用下一个css做的：

.ui-menu .ui-separator { 
   background: #A8A8A8; 
   border: none; 
   width: 1px; 
   clear: none; 
   height: 22px; 
   margin: 4px 6px 0; 
   box-shadow: none; 
}

关键是宽度和清除。您可以根据自己的喜好调整高度，背景颜色和边距。

Answer 2

试试这个：

<p:spacer width="1" height="22" style="position: relative; bottom: -5px;background-color: #A8A8A8; margin-left: 10px;margin-right: 10px" />

Answer 3

试试这个：

<p:separator id="customSeparator" style="width:100%;height:1px" />