...
| Expand | ||||
|---|---|---|---|---|
| ||||
|
Design
Use When
- Displaying details about 2-5 categories on a webpage
- You need to display more information than will fit in individual cards
- Adding specific details to a program subpage (e.g. Adding applied learning details to a Curriculum page)
...
| Code Block | ||||||
|---|---|---|---|---|---|---|
| ||||||
<div class="row"> <div class="col-12 col-lg-7 pe-lg-5"> ADD CONTENT </div> <div class="col-12 col-lg-5 mt-4 mt-lg-0"> ADD CONTENT </div> </div> |
2 Columns - 50% / 50%
| Code Block | ||||||
|---|---|---|---|---|---|---|
| ||||||
<div class="row">
<div class="col-12 col-lg-6 pe-lg-4">
ADD CONTENT
</div>
<div class="col-12 col-lg-6 mt-4 ps-lg-4">
ADD CONTENT
</div>
</div> |
3 Columns
| Code Block | ||||||
|---|---|---|---|---|---|---|
| ||||||
<div class="row gx-5"> <div class="col-12 col-lg-4"> ADD CONTENT </div> <div class="col-12 col-lg-4"> ADD CONTENT </div> <div class="col-12 col-lg-4"> ADD CONTENT </div> </div> |
...