Grids are one of the few features of jQuery Mobile that do not make use of particular data attributes. Instead, you work with grids simply by specifying CSS classes for your content.
Grids come in four flavors: two-column, three-column, four-column, and five-column. (You will probably not want to use the five-column grid on a mobile phone device. Save that for a tablet instead.)
You begin a grid with a
div block that makes use of the
ui-grid-X class, where
X will be either
ui-grid-a represents a two-column grid, whereas
ui-grid-b is a three-column grid. You can probably guess what
So to begin a two-column grid, you would wrap your content with the following:
<div class="ui-grid-a"> Content ...