is now part of Shuffle™. The new editor includes templates for Bootstrap, Bulma, Material-UI, and Tailwind CSS.
Switch to Shuffle →
← all Bootstrap classes list

Bootstrap class: .close

<button type="button" class="close" aria-label="Close">
  <span aria-hidden="true">&times;</span>
</button>

Preview

Check .close in a real project

Click one of the examples listed below to open the Shuffle Visual Editor with the UI library that uses the selected component.

Open in Visual Editor →
Open in Visual Editor →
Open in Visual Editor →
Open in Visual Editor →
Open in Visual Editor →
Open in Visual Editor →
Open in Visual Editor →
Open in Visual Editor →
Open in Visual Editor →
Open in Visual Editor →

Tips 💡

You don't need to remember all CSS classes. Just use the Bootstrap Editor instead.

Sass source

/* _alert.scss:33 */
.close {
  position: absolute;
  top: 0;
  right: 0;
  padding: $alert-padding-y $alert-padding-x;
  color: inherit;
}

/* _modal.scss:108 */
.close {
  padding: $modal-header-padding;
  // auto on the left force icon to the right even when there is no .modal-title
  margin: (-$modal-header-padding) (-$modal-header-padding) (-$modal-header-padding) auto;
}

Uses variables

Code copied to the clipboard.

Copying failed

/* _alert.scss:33 */
$alert-padding-y
$alert-padding-x

/* _modal.scss:108 */
$modal-header-padding
$modal-header-padding
$modal-header-padding
$modal-header-padding

More in Bootstrap Misc

Bootstrap 4 & 5