-
FEATURED COMPONENTS
First time here? Check out the FAQ!
Hi all,
I am returning to ZK programming after a number of years away doing other stuff, and in my first step in building a simple index page with a 'north' borderlayout to show an app logo I'm getting an unexpected vertical alignment issue.
<zk>
<borderlayout width="100%" height="100%" >
<north height="90px" border="none" >
<borderlayout width="100%" height="100%" >
<west border="none" >
<image src="/image/logo-1.png" width="226px" height="62px" />
</west>
<east border="none">
</east>
</borderlayout>
</north>
<center>
</center>
</borderlayout>
</zk>
The web UI is showing a vertical gap between the alignment of the image and vertical space set aside for the 'north' area. The image seems to be bottom vertical aligned, so that a white space appears vertically above image. Why?
I've tried various things like putting the image inside a hlayout tag and setting the valign to top, but nothing seems to change the vertical alignment of the image.
Suggestions?
Finally, is there a way to void setting a 'north' height and have it size automatically to fit the image?
Playing around with my ZUL code, I noticed that if I set the wrapping borderlayouts to have a 'vflex=min' then the logo image is centered vertically in a much larger vertical space.
From this I'm inferring that the default 'image' tag has some padding element associated with it, right? If so, how would I change this so that the padding is removed?
By the way, where can I find the default styles that are applied to all ZK tags?
Asked: 2019-03-29 19:24:24 +0800
Seen: 4 times
Last updated: Mar 30 '19