Most of us are familiar with 970 px wide page layout. We divide the area into multiple columns and gutters. This is how it is done as shown in figure 1.1. It gives us more options for designing modules, but in width. Most of the time module height is decided by the content in the module, if not then adjusted optically.

Grid 970 px

Figure 1.1 Shoing 24 columns of 30px width and 25 columns of 10px

 

 

It is seen that designers are particular about getting the module width precise but not height. It is left to the visual designer to fix the vertical height.

Can we fix vertical height as well? Is there any formula by which we can calculate the vertical space?