Expand first groupbox and collapse remaining group by default using zk

Today blog entry is dedicated to this question in stackoverflow
Now see how can we achieve this the ZUL code for this..

And Java Code or we can say Zk View Modal Window


Its a basic sample code developer can change it according to their requirements and Zk fiddle here is the running sample code

How to change Expand and Collapse images of ZK Grid hierarchy Component

Today i got a new POC(Proof of concept) task how can we change the default expand and collapse images of ZK Grid hierarchy Component as i am not much knowledge of CSS i am not sure how we can do this. Its clear to me we have to make change in CSS to achieve this but in which css class i have to made the changes i am not sure then i have to ask this question Ben bai a zk developer ,very well and deep knowledge about ZK,CSS,Jquery etc. He told me to write this below CSS to achieve this



Here is the ZUL file for this ..


Note:- As i am not sure how we can get which CSS apply in which component @Ben suggest me a better way to do this in Google Chrome Browser ,What we can do is right-click on the expand/collapse icon in Chrome then click 'Inspect element' to view the dom elements and its css style in Chrome console