using rich:separator

[jamesjmp]

hi,
In a form I want to use rich:separator component to separate some s:decorate elements.
This is my code:

<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<ui:composition xmlns="http://www.w3.org/1999/xhtml"
 xmlns:s="http://jboss.com/products/seam/taglib"
 xmlns:ui="http://java.sun.com/jsf/facelets"
 xmlns:f="http://java.sun.com/jsf/core"
 xmlns:h="http://java.sun.com/jsf/html"
 xmlns:a="https://ajax4jsf.dev.java.net/ajax"
 xmlns:rich="http://richfaces.ajax4jsf.org/rich"
 template="layout/template.xhtml">

 <ui:define name="body">

 <h:messages globalOnly="true" styleClass="message" id="globalMessages"/>
 <h:form id="rstReport" styleClass="edit">

 <rich:panel>
 <f:facet name="header">#{messages['New']} #{messages['RstReport']}</f:facet>

<!-- some s:decorate elements .. -->

 <s:decorate id="shortDescriptionDecoration" template="layout/edit.xhtml">
 <ui:define name="label">#{messages['RstReport.shortDescription']}</ui:define>
 <h:inputText id="shortDescription"
 size="100"
 maxlength="125"
 value="#{rstReportHome.instance.shortDescription}">
 <a:support event="onblur" reRender="shortDescriptionDecoration"/>
 </h:inputText>
 </s:decorate>


<rich:separator lineType="beveled" height="8" width="75%" align="center"/>

 <s:decorate id="timeHorizonDecoration" template="layout/edit.xhtml">
 <ui:define name="label">#{messages['RstReport.timeHorizon']}</ui:define>
 <h:inputText id="timeHorizon"
 required="true"
 value="#{rstReportHome.instance.timeHorizon}">
 <a:support event="onblur" reRender="timeHorizonDecoration"/>
 </h:inputText>
 </s:decorate>

<!-- more s:decorate elements .. -->

The separator appears, but NOT between my 2 s:decorate elements, it is overlapped on the first element.


I have tried with br but it keeps on not appearing where I would like it to.
Besides, I have tried with the following:

 <s:decorate id="separator" template="layout/edit.xhtml">
 <rich:separator lineType="beveled" height="8" width="75%" align="center"/>
 </s:decorate>

This way, separator does not appear.

Any idea? thanks in advance!