Material Theme Full-width / Fixed-width Grids and Blocks

In several themes around the web we often find layouts where a sliding banner or a row of the website is nicely presented in full-width whereas the actual content of the row is at a fixed with. By default CS-Cart does not offer this functionality and limits itself by either using a fluid layout of max and min width, or a full-width layout that streches both the grid and the containing blocks content to full size.

In our Material theme you have the option (just for the homepage, but we can customize it for the rest of the locations upon request) to define which grids are full width and which are fixed width.

On your layouts manager create for the homepage, a new grid of size 16. By default this grid will fill the screen from side to side. If you want to include inside this full-width grid a new child grid or a block of a fixed-width size you can do so by filling in the User Defined CSS Class the value fixed-width as illustrated below.