Tags
People
Badges
Help-
CORE FRAMEWORK
FEATURED COMPONENTS
-
RESOURCES
-
LEARN ZK
RESOURCES
I'm trying to align four images in a square layout, so I've used 'vlayout' and 'hlayout' to control this, like..
private void renderTestCompCell(Component aParent, TestMatrixComponentDO aCompDO) {
Vlayout aVLayout = new Vlayout();
aVLayout.setParent(aParent);
aVLayout.setSpacing("0");
Hlayout aTopLayout = new Hlayout();
aTopLayout.setParent(aVLayout);
aTopLayout.setSpacing("0px");
Image anImageTL = new Image("/image/data/matrix/small/top_left_blank.png");
anImageTL.setParent(aTopLayout);
Image anImageTR = new Image("/image/data/matrix/small/top_right_blank.png");
anImageTR.setParent(aTopLayout);
Hlayout aBottomLayout = new Hlayout();
aBottomLayout.setParent(aVLayout);
aBottomLayout.setSpacing("0px");
Image anImageBL = new Image("/image/data/matrix/small/bottom_left_blank.png");
anImageBL.setParent(aBottomLayout);
Image anImageBR = new Image("/image/data/matrix/small/bottom_right_blank.png");
anImageBR.setParent(aBottomLayout);
maybe this helps? http://www.zkoss.org/forum/listComment/16626/1/20#reply
adding "px" to the spacing parameter.
@davout,
I tried this example code and it works.
<vlayout spacing="0px">
<div style="width:100px; height:20px;background-color:red"/>
<div style="width:100px; height:20px;background-color:green"/>
</vlayout>
Hi davout,
I could reproduce your issue in IE. In FF there isn't a gap between the rows.
I changed the vlayout and hlayout in vbox and hbox. This solves the problem in IE8 but not in IE7. In IE7 there is still a thin gap:
<zk>
<vbox spacing="0px">
<hbox spacing="0px">
<image src="/img/test.jpg"/>
<image src="/img/test.jpg"/>
</hbox>
<hbox spacing="0px">
<image src="/img/test.jpg"/>
<image src="/img/test.jpg"/>
</hbox>
</vbox>
</zk>
regards,
Gunter
Asked: 2011-06-20 09:45:55 +0800
Seen: 272 times
Last updated: Jun 29 '11