2つのプライムフェイスを同じページ内で異なる位置に置くことはできますか？

Question

私はいくつかのp：growlコンポーネントを同じページの異なる位置に置く必要があります。 1つは左側、右側は1つ、中央は1つです。私はそれがこのようにすべてのうなり声に影響されたスタイルをオーバーライドしていた場合 しかし：

<style type="text/css"> 
      .ui-growl{ 
       left:100px; 
      } 
     </style> 

は、私が別のUI-うなり声のスタイルを持っているべきものを意味しています。私はそれを作成しましたが、それは助けにはなりません。

.ui-growl1{ 
       right:30px; 
      } 

Answer 1

あなたは、スタイルを適用するには、アカウントのどの要素を指定することができます。

.ui-growl:nth-child(2) { 
    right:30px; 
} 

Answer 2

ソリューションは

<style type="text/css"> 
       div[id="growl-error_container"] { 
        // background-color: red !important; 
        right:30px; 
       } 
       div[id="growl-success_container"] { 
        // background-color: green !important; 
        left: 30px; 
        width: 360px; 
        height: 110px; 

       } 
      </style> 

       <p:growl id="growl-error" class="ui-growl" showDetail="true" sticky="true" /> 

       <p:growl id="growl-success" showDetail="true" sticky="true"/>