Change position of p:growl

[ahoehma]

How can I change the position of the growl-container?
The container id is "gritter-notice-wrapper" ... allways?
Where can I change the default css?

regards
Andreas
http://www.ahoehma.de

[cagatay.civici]

I think that should be a style class instead of a fixed id. I think we need to improve the skinning of growl.

For now you can do;

Code: Select all

<style type="text/css">
#gritter-notice-wrapper {
    top:20px;
    left:20px;
}
</style>

For example this places growl to the top left corner. Again, this will be improved to use style classes instead soon.

[cagatay.civici]

You can monitor to changes by subscribing(voting);

http://code.google.com/p/primefaces/iss ... ail?id=316

[zorro6064]

I need to locate growl in right and middle position
I use id but its position don't changed and is on the top left

Code: Select all

    <h:head>
        <title>Facelet Title</title>
        <style type="text/css">
           #growl {
                padding-left: 20px;
                padding-top: 20px;
            }
        </style>
    </h:head>
    <h:body>
         <p:growl id="growl" showDetail="true" sticky="true" />
        <h:form id="test">
            <p:panel header="Growl">
                <h:panelGrid columns="2">
                    <h:outputText value="Your Name: * " />
                    <p:inputText value="#{growl.test}" required="true" label="name" />
                </h:panelGrid>
                <p:commandButton value="Save" actionListener="#{growl.save}" update="growl" />
            </p:panel>
        </h:form>
    </h:body>

how can I fix this problem?
I use primefaces 3.0M1

[Franke]

You need to set the left/right and top/bottom properties, not padding.

.ui-growl {
right: 20px;
top: 50%;
}

would set all growl components at the right side and start halfway down the page. True vertical centralizing is abit harder.