right align buttons as a group inside a layout?

<div style="text-align: right;">
   <hbox ...>
</div>

<?xml version="1.0" encoding="UTF-8"?>
<?taglib uri="http://www.zkoss.org/dsp/web/core" prefix="c"?>

<zk xmlns="http://www.zkoss.org/2005/zul"
	xmlns:h="http://www.w3.org/1999/xhtml"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xmlns:a="http://www.zkoss.org/2005/zk/annotation"
	xsi:schemaLocation="http://www.zkoss.org/2005/zul http://www.zkoss.org/2005/zul/zul.xsd">


	<window id="window_BranchesDialog"
		title="${c:l('window_BranchesDialog.title')}" border="none"
		use="org.myfirm.webui.branch.BranchDialogCtrl"
		closable="true" width="450px" height="250px">


		<borderlayout id="borderlayoutBranchDialog">
			<north border="none" margins="0,0,0,0">
				<div id="divNorthBranchDialog">

					<toolbar>
						<button id="btnHelp"
							image="/images/icons/light_16x16.gif"
							tooltiptext="${c:l('btnHelp.tooltiptext')}" />
					</toolbar>


					<panel id="panel_Branch"
						title="${c:l('panel_Branch.title')}" style="margin-bottom:10px"
						border="normal" collapsible="true">
						<panelchildren>
							<grid fixedLayout="true"
								style="border:0px">
								<columns>
									<column width="150px" />
									<column width="100%" />
								</columns>
								<rows>
									<row>
										<label id="label_Branch_BraNr"
											value="${c:l('label_Branch_BraNr.value')}" />
										<textbox id="braNr"
											width="100px" />
									</row>
									<row>
										<separator bar="true"></separator>
										<separator bar="true"></separator>
									</row>
									<row>
										<label
											id="label_Branch_BraBezeichnung"
											value="${c:l('label_Branch_BraBezeichnung.value')}" />
										<textbox id="braBezeichnung"
											width="100%" />
									</row>
								</rows>
							</grid>
						</panelchildren>
					</panel>

				</div>
			</north>
			<east border="none"></east>
			<center border="none"></center>
			<west border="none"></west>

			<south border="none" margins="1,0,0,0" size="26px">
				<div id="divSouth" align="right">
					<hbox spacing="3px" style="padding:3px"
						align="end">
						<button id="btnNew" height="20"
							label="${c:l('btnNew.label')}"
							tooltiptext="${c:l('btnNew.tooltiptext')}" />
						<button id="btnEdit" height="20"
							label="${c:l('btnEdit.label')}"
							tooltiptext="${c:l('btnEdit.tooltiptext')}" />
						<button id="btnDelete" height="20"
							label="${c:l('btnDelete.label')}"
							tooltiptext="${c:l('btnDelete.tooltiptext')}" />
						<button id="btnSave" height="20"
							label="${c:l('btnSave.label')}"
							tooltiptext="${c:l('btnSave.tooltiptext')}" />
						<button id="btnClose" height="20"
							label="${c:l('btnClose.label')}"
							tooltiptext="${c:l('btnClose.tooltiptext')}" />
					</hbox>
				</div>
			</south>

		</borderlayout>

	</window>

</zk>

<hbox width="100%" pack="end">
<div>
	<button id="ok" label="OK" />
	<space />
	<button id="apply" label="Apply" />
	<space />
	<button id="clearAll" label="Clear All" />
        <space />
	<button id="close" label="Close" />
	<space />
</div>
</hbox>

<toolbar style="clear: both;">
		<div style="float: left">
		<button label="Action1" href="calendar/" />
		<button label="Action2" onClick="debug();" />
		</div>
		<div style="float: right;">
		<button id="logout" label="Logout" onClick="logout();"/>
		</div>
</toolbar>

<toolbar width="100%"  >
		<span>
		<button label="Action1" href="calendar/" />
		<space />
		<button label="Action2" />
		</span>
		<span style="position: absolute; right:3px">
		<button id="logout" label="Logout" onClick="logout();"/>
		</span>
</toolbar>

<div style="float:right;">
	<button id="ok" label="OK" />
	<space spacing="5px" orient="vertical"/>
	<button id="apply" label="Apply" />
	<space spacing="5px" orient="vertical"/>
	<button id="clearAll" label="Clear All" />
	<space spacing="5px" orient="vertical"/>
	<button id="close" label="Close" />
</div>