Skip to content

GridList API

The API documentation of the GridList React component. Learn more about the props and the CSS customization points.

Import

import GridList from '@material-ui/core/GridList';
// or
import { GridList } from '@material-ui/core';

You can learn more about the difference by reading this guide.

Props

Name Type Default Description
cellHeight number
| 'auto'
180 Number of px for one cell height. You can set 'auto' if you want to let the children determine the height.
children * node Grid Tiles that will be in Grid List.
classes object Override or extend the styles applied to the component. See CSS API below for more details.
cols number 2 Number of columns.
component elementType 'ul' The component used for the root node. Either a string to use a DOM element or a component.
spacing number 4 Number of px for the spacing between tiles.

The ref is forwarded to the root element.

Any other props supplied will be provided to the root element (native element).

CSS

  • Style sheet name: MuiGridList.
  • Style sheet details:
Rule name Global class Description
root .MuiGridList-root Styles applied to the root element.

You can override the style of the component thanks to one of these customization points:

If that's not sufficient, you can check the implementation of the component for more detail.

Demos