प्राइमफेस एक विशिष्ट पी के लिए कस्टम पोजीशनिंग: उग

Question

मैं प्राइमफ़ेस 3.3.1 का उपयोग कर रहा हूं। मैं उगने को अनुकूलित कर सकता हूं:

.ui-growl { 
    position:absolute; 
    top:50%; 
    left:50%; 
    z-index:9999; 
} 

लेकिन यह सभी उगने को अनुकूलित करता है। मुझे केवल एक विशिष्ट <p:growl> को कस्टमाइज़ करने की आवश्यकता है। मेरा मतलब है, मैं केंद्र में केवल एक उगाना और बाकी के शीर्ष दाएं कोने में रखना चाहता हूं। उसको कैसे करे?

धन्यवाद।

Answer 1

जैसा कि आप जेनरेट किए गए HTML से देख सकते हैं growl घटक आपके वास्तविक उत्पाद डेटा को नहीं रख रहा है।

<div id="your_growl_id + _container"> 

तो गुर्राने के लिए सही सीएसएस चयनकर्ता होगा:: संदेश जो कोने में दिखाई दे रहा है एक div तत्व द्वारा पकड़ है

div[id="growlForm1:growlCenter_container"] {} 

(मुझे लगता है अपने ग्राउल घटकों ही में रखा जाता है प्रपत्र)। अंत में आप अपनी पोस्ट में बताया गया है कि अगर आप अपने पृष्ठ पर दो ग्राउल घटक:

<h:form id="growlForm1"> 
    <p:growl id="growlCenter" showDetail="true" sticky="true" /> 
    <p:growl id="growlRight" showDetail="true" sticky="true" /> 
</h:form> 

सिर्फ केंद्रित और नहीं केन्द्रित ग्राउल कंटेनरों के लिए वांछित सीएसएस गुण आवंटित:

div[id="growlForm1:growlRight_container"] { 
    position:absolute; 
    top:20px; 
} 
div[id="growlForm1:growlCenter_container"] { 
    position:absolute; 
    top:20px; 
    left:40%; 
} 

ध्यान दें कि आप की prependId="false" विशेषता का उपयोग कर सकते हैं। यह सीएसएस चयनकर्ताओं को सरल बना देगा। लेकिन यह सलाह दी जाती है कि इसका उपयोग न करें, UIForm with prependId="false" breaks <f:ajax render>