gecko-dev/webshell/tests/viewer/samples/toolbarTest1.xul

<?xml version="1.0"?> 
<?xml-stylesheet href="chrome://navigator/skin/navigator.css" type="text/css"?> 

<!DOCTYPE window> 

<window align="vertical" xmlns:html="http://www.w3.org/1999/xhtml"
        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
        onConstruction="Startup()"> 

<html:div>
	<html:h1>Toolbar Test 1</html:h1>

	<html:h3>
		You should see a two toolbars with buttons that don't do anything. This test is useful for checking layout
		and look/feel of rollover and clicks. Note that the last toolbar is empty, and should be of
		normal size because of min-height.
	</html:h3>

    <html:hr/>
</html:div>

<toolbox style="min-width: 10px">  
   <toolbar>
      <titledbutton id="back-button"    align="top" value="Back"/>	
      <titledbutton id="forward-button" align="top" value="Forward"/>
	  <titledbutton id="reload-button"  align="top" value="Reload"/>
	  <titledbutton id="stop-button"    align="top" value="Stop"/>
	  <titledbutton id="home-button"    align="top" value="Home"/>
	  <titledbutton id="print-button"   align="top" value="Print"/> 

          <box align="vertical" flex="100%">
            <spring flex="100%"/>
            <html:input id="urlbar" type="text"/>   
	    <spring flex="100%"/>
          </box>

          <titledbutton src="resource:/res/throbber/anims00.gif" align="right"/>
    
    </toolbar>

    <toolbar>
      <titledbutton align="left" id="translate-button" value="Mozilla" />
      <titledbutton align="left" id="translate-button" value="ABC News"/>
	  <spring flex="100%"/>
    </toolbar>
    
    <toolbar>
    </toolbar>
  </toolbox>

</window>