Borders

From Foundation
Jump to navigation Jump to search

Borders

Use border utilities to quickly style the border and border-radius of an element. Great for images, buttons, or any other element.

Border color

Change the border color using utilities built on our theme colours.

<span class="border border-primary"></span>
<span class="border border-secondary"></span>
<span class="border border-success"></span>
<span class="border border-danger"></span>
<span class="border border-warning"></span>
<span class="border border-info"></span>
<span class="border border-light"></span>
<span class="border border-dark"></span>
<span class="border border-white"></span>

Border-radius

Add classes to an element to easily round its corners.

<div class="bd-example-border-utils">
<div class="bd-example">
<span class="border border-primary rounded"></span>
<span class="border border-primary rounded-top"></span>
<span class="border border-primary rounded-right"></span>
<span class="border border-primary rounded-bottom"></span>
<span class="border border-primary rounded-left"></span>
<span class="border border-primary rounded-circle"></span>
<span class="border border-primary rounded-pill"></span>
<span class="border border-primary rounded-0"></span>
</div>
</div>

Support

Please use the discussion page to ask questions.



TOP

Retrieved from ‘https://foundationextension.com/index.php?title=Borders&oldid=349