XUL Programmer's Reference Manual

<spring>

Attributes Common Children
flex * * *
   
   
   

The <spring> widget is a layout tool that can be used to constrain other widgets in a XUL UI. Within a container (e.g.,a box), use flexible springs to occupy real estate and position other child widgets. Note that, to some extent, the use of the spring element has been deprecated by the addition of the orient and autostretch attributes on the box, as well as the css properties it now supports for layout.

The following examples show springs with varying degrees of flexibility constraining the position of a button box within a box container:
 
 
<box align="horizontal" flex="1">
  <box align="vertical" style="background-color:lightgrey;">
    <box style="background-color:lightblue;">
       <titledbutton class="borderless" value="small1" />
       <titledbutton class="borderless" value="small2" />
    </box>
    <spring flex="1" />  
  </box>
</box>
<box align="horizontal" flex="1">
  <box align="vertical" style="background-color:lightgrey;">
    <box flex="100%" style="background-color:lightblue;">
       <titledbutton class="borderless" value="small1" />
       <titledbutton class="borderless" value="small2" />
    </box>
    <spring flex="100%" /> 
  </box>
</box>
<box align="horizontal" flex="1">
  <box align="vertical" style="background-color:lightgrey;">
    <box flex="1" style="background-color:lightblue;">
       <titledbutton class="borderless" value="small1" />
       <titledbutton class="borderless" value="small2" />
    </box>
    <spring flex="2" /> 
  </box>
</box>

 

Last updated: 13:10 1/26/00 Ian Oeschger