Time for action – setting layouts size
Let's make our layout component use all the available space on the page:
Set the size of the
MainLayout
by adding the following line to the constructor:setSizeFull();
Set the size of the
lowerSection
and its components by adding the following to theMainLayout
constructor:lowerSection.setSizeFull(); menuLayout.setSizeFull(); contentLayout.setSizeFull();
Run the application.
What just happened?
This is what happens to the layouts when we make them size full:
We are getting closer to our aim. However, there is still a gap between the header and the lower component.