p:messages not formatted.

I have been using p:messages in all my facelets pages and works great and displays formatted according to the severity. However, I have a login page that is a standalone jsf page (not facelets). The p:messages in that page appear un-formatted like normal faces message. Not only that, I have included p:messages compoenent at the top, but the messages are displayed in the bottom. Can anyone suggest a remedy for this behaviour. Here is my code.

Code: Select all

    <h:head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <link type="text/css" rel="stylesheet"
              href="/donor/resources/themes/cupertino/skin.css"/>
        <link href="/donor/resources/css/default.css" rel="stylesheet" type="text/css" />
        <link href="/donor/resources/css/cssLayout.css" rel="stylesheet" type="text/css" />
        <p:resources />
    </h:head>
    <h:body>
        <f:view contentType="text/html">
            <h:form id="f">
                <h:panelGrid>
                        <p:messages id="msgs" globalOnly="true" redisplay="false" />
                        <p:fieldset >
                        ...................more contents not shown.


As you can see I have included message in top part, but it is displayed at the bottom of the screen after all components are displayed. This problem occurs only with one page (loginPage) that is not a part of facelets.

regards,
Nirvan.