July 2017
Intermediate to advanced
384 pages
8h 23m
English
The layout container should have the ui-g style class. Children elements of the layout container become columns when they are prefixed with ui-g-* where * is any number from 1 to 12. The number expresses the taken space of 12 available units. When the number of columns exceeds 12, columns wrap to the next line:
<div class="ui-g"> <div class="ui-g-2">2</div> <div class="ui-g-4">4</div> <div class="ui-g-6">6</div> <div class="ui-g-8">8</div> <div class="ui-g-4">4</div></div>
The following layout has two lines (rows):

The same two-row layout is also possible with two ui-g containers:
<div class="ui-g"> <div class="ui-g-2">2</div> ...
Read now
Unlock full access