Right white space in zk - zk

Question

I create a web page with a listbox and button, the problem is that when page loads, a white space appear at the right of both components, but if resize the page the spaces disappear.
<zk xmlns="http://www.zkoss.org/2005/zul">
<div apply="org.zkoss.bind.BindComposer" viewModel="#id('vm') #init('com.valid.pmngr.product.ProductViewModel')" height="100%" width="100%" style="border: 3px solid red;">
<style src="/css/style.css"/>
<div height="94%" width="100%" style="border: 3px solid orange;">
<vbox vflex="1" hflex="1" style="border: 3px solid blue;">
<hbox align="end" width="100%" style="background-color:#282425; padding: 30px 0px 15px 60px">
<separator height="58px"/>
<image src="/img/Logo.png"/>
</hbox>
<separator height="15px"/>
<grid>
<auxhead>
<auxheader label="Products" zclass="auxheader-g"/>
</auxhead>
<columns />
</grid>
<listbox model="#load(vm.productStatusList) #template((vm.displayEdit and each.editingStatus) ? 'editable' : 'noneditable')"
vflex="1" >
<listhead sizable="true">
<listheader label="Name" align="center"/>
<listheader label="Vertical" align="center"/>
<listheader label="Business unit" align="center"/>
<listheader/>
</listhead>
<template name="noneditable">
<listitem>
<listcell>
<label width="98%" value="#bind(each.product.name)" />
</listcell>
<listcell>
<label width="98%" value="#bind(each.product.vertical)" />
</listcell>
<listcell>
<label width="98%" value="#bind(each.product.businessUnit)" />
</listcell>
<listcell>
<button image="/img/edit.png" onClick="#command('edit')"/>
<button image="/img/delete.png" onClick="#command('delete')" />
</listcell>
</listitem>
</template>
</listbox>
</vbox>
</div>
<div vflex="min" style="border: 3px solid purple;">
<vbox hflex="1" vflex="1" style="border: 3px solid black;">
<button label="New" onClick="#command('newProduct')" />
</vbox>
</div>
</div>
</zk>
When page loads in full screen:
1
And after resize:
2
what is the problem?
EDIT
The white spaces appear in chrome, firefox and iExplorer and the version of zk is 8.0.1.1

Answer 1

I edited your fiddle to this. Can you check it out it meets your requirements?
I altered some things, for correctness :
Using spacing attribute in separator in stead of height.
vbox changed to vlayout as the align attribute is absolute here, and vlayout is lighter in generated html.
Removing the width and hflex where it is not needed.
Removing height and vflex where not needed and only set where needed.