grid

Arranges elements in a grid pattern.

Overview

Items inside of the grid are displayed in a row that is bound by the size of the screen. Items are automatically moved to another row after a row is filled. Here’s an example of three lockup elements inside of a grid element.

<grid>
    <section>
        <lockup>
            <img src="http://localhost:9001/images/Car_Movie_250x375_A.png" width="182" height="274" />
            <title>Movie 1</title>
        </lockup>
        <lockup>
            <img src="http://localhost:9001/images/Car_Movie_250x375_B.png" width="182" height="274" />
            <title>Movie 2</title>
        </lockup>
        <lockup>
            <img src="http://localhost:9001/images/Car_Movie_250x375_C.png" width="182" height="274" />
            <title>Movie 3</title>
        </lockup>
    </section>
</grid>