<section role="NotInToc" id="rich_layout">
   <title>
				&lt;
				rich:layout
				&gt;
				<emphasis role="since">
         <superscript> available since <emphasis role="version">3.3.1</emphasis>
         </superscript>
      </emphasis>
   </title>
   <section>
     <title>Description</title>
     <para>The <emphasis role="bold">
            <property>&lt;rich:layout&gt;</property>
         </emphasis> component is designed to build layouts basing on Yahoo UI Grids CSS
     </para>   
    </section>
   <section>
      <title>Key Features</title>    
      <itemizedlist>
        <listitem>
            <para>Cross-borwser compatibility</para>
         </listitem>
        <listitem>
            <para>Easy layout creation</para>
         </listitem>                                                                                                                                                                                                                                                                
      </itemizedlist>
   </section>
   <section>
                    <title>Details of Usage</title>
                    
                    <para>The <emphasis role="bold">
            <property>&lt;rich:layout&gt;</property>
         </emphasis> allows to build a grid that can be used to make the layout on a page. The <emphasis role="bold">
            <property>&lt;rich:layout&gt;</property>
         </emphasis> is used in conjunction with the <emphasis role="bold">
            <property>&lt;rich:layoutPanel&gt;</property>
         </emphasis> that is used as a child element and carries the main burden of building the grid.</para>
                   
                   <para>Hence, you need to use the <emphasis role="bold">
            <property>&lt;rich:layout&gt;</property>
         </emphasis> as a container and <emphasis role="bold">
            <property>&lt;rich:layoutPanel&gt;</property>
         </emphasis> to create areas inside the container.</para> This is how you can  make a layout with 5 areas:
                    
          
          <para>
                    <emphasis role="bold">Example:</emphasis>
          </para>
                    
          <programlisting role="XML"><![CDATA[...
<rich:layout>
		<rich:layoutPanel position="top">
				<!--top-->
		</rich:layoutPanel>
		<rich:layoutPanel position="left">
				<!--left-->
		</rich:layoutPanel>
		<rich:layoutPanel position="center">
				<!--center-->
		</rich:layoutPanel>
		<rich:layoutPanel position="right">
				<!--right-->
		</rich:layoutPanel>
		<rich:layoutPanel position="bottom">
				<!--bottom-->
		</rich:layoutPanel>
</rich:layout>
...]]></programlisting> 
                    <para>To get more details about <emphasis role="bold">
            <property>&lt;rich:layoutPanel&gt;</property>
         </emphasis> please read the <link linkend="rich_layoutPanel">  chapter about layoutPanel </link> in the guide.</para>                         
          </section>
   <section>
      <title>Reference Data</title>
      <para>
         <ulink url="&tlddoc;rich/layout.html">Table of 
							&lt;rich:layout&gt; 
							 attributes</ulink>.
						</para>
      <table>
                    <title>Component Identification Parameters </title>
                    <tgroup cols="2">
                              <thead>
                                        <row>
                                                  <entry>Name</entry>
                                                  <entry>Value</entry>
                                        </row>
                              </thead>
                              <tbody>
                                        <row>
                                                  <entry>component-type</entry>
                                                  <entry>org.richfaces.Layout</entry>
                                        </row>
                                        <row>
                                                  <entry>component-class</entry>
                                                  <entry>org.richfaces.component.html.HtmlLayout</entry>
                                        </row>
                                        <row>
                                                  <entry>component-family</entry>
                                                  <entry>org.richfaces.Layout</entry>
                                        </row>
                                        <row>
                                                  <entry>renderer-type</entry>
                                                  <entry>org.richfaces.LayoutRenderer</entry>
                                        </row>
                                        <row>
                                                  <entry>tag-class</entry>
                                                  <entry>org.richfaces.taglib.layoutTag</entry>
                                        </row>
                              </tbody>
                    </tgroup>
          </table>
   </section>
   <section>
                    <title>Relevant Resources Links</title>
                    <para>Visit 
					<ulink url="http://livedemo.exadel.com/richfaces-demo/richfaces/layouts.jsf">layout</ulink> page at 
					RichFaces Live Demo for examples of component usage and their sources.</para>
                    <para>The <ulink url="http://www.jboss.org/community/docs/DOC-13336">Layout components for RichFaces</ulink> on  the JBoss.org Wiki</para>
				
          </section>
</section>
