Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

You can add/remove fields as needed. Replace <!-- blank field --> with the desired content. To hide/unhide specific elements, use either the .visible utility class to unhide or the .hidden utility class to hide.

College Contact Design B

...

Code Block
<div class="mb-4">
<p><a href="<!-- blank field -->">
<img src="<!-- blank field -->" width="<!-- blank field -->" alt="<!-- blank field -->" loading="lazy">
</a></p>
<p class="mb-0"><a href="<!-- blank field -->">Download Logo</a></p>
</div>

Create a Grid Layout

To create a grid, use the below code snippet. Add or remove as many columns as needed. Use flexbox alignment utilities to vertically and horizontally align columns. Below is an example of a three column grid layout.

Code Block
<div class="container">
  <div class="row align-items-start">
    <div class="col"><!-- column 1 --></div>
    <div class="col"><!-- column 2 --></div>
    <div class="col"><!-- column 3 --></div>
  </div> </div>

College Contact Design B

...

Code Block
<div class="mb-4">
<p><a href="<!-- blank field -->">
<img src="<!-- blank field -->" width="<!-- blank field -->" alt="<!-- blank field -->" loading="lazy">
</a></p>
<p class="mb-0"><a href="<!-- blank field -->">Download Logo</a></p>
</div>