Question

在我的jsf / primefaces应用程序中，我在页脚中有<p:notificationBar>，我需要居中对齐它。我尝试为它设置对齐属性，试图把它放在居中对齐的div中，但它不起作用。任何帮助将不胜感激。

Answer 1

也许你想要这样的东西：

<p:notificationBar position="bottom" effect="slide" widgetVar="bar" style="text-align: center;">  
    <h:outputText value="Example"/>  
</p:notificationBar>

Answer 2

如果您想将文字居中：

<p:notificationBar styleClass="center-text"></p>

CSS：

.center-text { text-align: center;}

如果您希望使<p>居中，可以使用margin: 0 auto;，但只有当您放弃width时才会有效：

<p:notificationBar styleClass="center"></p>

CSS：

.center {
  margin: 0 auto;
  width: 200px;
}

如果由于内容是动态或变量而无法传递width，则可以为包装器text-align: center和<p> display : inline-block＆amp;重置text-align。

<foo>
  <p:notificationBar></p>
</foo>

CSS

foo {
 text-align: center;
}
foo p {
 display: inline-block;
 text-align: left; /* reset text-align center */
}

如何居中对齐<p：notificationbar> </p：notificationbar>

2 个答案: