In general, when we develop a website with ZK, we divide the webpage into header, body and footer with the borderlayout. However, there are times when we can utilize a layout component such as the columnlayout to effectively make use of the space of the page layout. Unlike the borderlayout, when the height of the content is larger than the default height in case of a columnlayout, a vertical scrollbar will appear on the right side of the browser instead of the content itself.
Suppose we want to create an online shopping website where users can read news about the latest items and can browse the various kinds of items easily. Finally, we also need a function that is able to show the statistics of online shoppers.
The following figure illustrates the structure and how the columnlayout is placed on screen. This particular webpage uses the columnlayout as the body part.
The following screenshots illustrates the corresponding side bar and content that’s inside the columnlayout shown in the figure above: