Bootstrap grid
The AU Theme uses the Bootstrap 4 Grid system to make it easy as possible to make layouts. Please visit the Bootstrap Documentation for more detailed explanations on the Grid system. If you would like the grid to break at a particular point, specify a numbered class, as shown in the below example.
1 of 2
2 of 2
1 of 3
2 of 3
3 of 3
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!--Each column stays at 1/2 width on ALL screen sizes--> | |
| <div class="row"> | |
| <div class="col"> | |
| <div>1 of 2</div> | |
| </div> | |
| <div class="col"> | |
| <div>2 of 2</div> | |
| </div> | |
| </div> | |
| <!--Each column stays at 1/3 width when screen size is above 44em --> | |
| <div class="row"> | |
| <div class="col-sm-4"> | |
| <div>1 of 3</div> | |
| </div> | |
| <div class="col-sm-4"> | |
| <div>2 of 3</div> | |
| </div> | |
| <div class="col-sm-4"> | |
| <div>3 of 3</div> | |
| </div> | |
| </div> |
Updated August 19, 2024 by Digital & Web Operations (web_services@athabascau.ca)