The University of Alabama The University of Alabama Toggle navigation
  • UI Elements
    • Buttons
    • Dividers
    • Forms
    • Headings
    • Icons
    • Logos & Identifiers
    • Tables
    • Typography
    • CSS Helpers
  • Components
    • Accordions
    • Alerts
    • Dropdowns
    • Lists
    • Modals
    • Media Object
    • Pagination
    • Panels
    • Tabs
    • Thumbnails
    • Videos
  • Features
    • Animations on Scroll
    • Backgrounds
    • Breadcrumbs
    • Carousels
    • Charts
    • Headers
    • Footers
    • Galleries
    • Content Boxes
    • Icon Boxes
    • Image Boxes
    • Maps
    • Mega Menus
    • Timelines
  • Pages
      • Home 1
      • Home 2
      • Home 3
      • Home 4
      • Home 5
      • Home 6
      • Home 7
      • Home 8
      • Home 9
      • Home 10
      • Secondary 1
      • Secondary 2
      • Secondary 3
      • Secondary 4
      • Tertiary 1
      • Tertiary 2
      • Tertiary 3
      • Tertiary 4
      • Blog 1 - Sidebar
      • Blog 1 - Full Width
      • Blog 2 - Sidebar
      • Blog 2 - Full Width
      • Masonry Grid - Sidebar
      • Masonry Grid - Full Width
      • 404 Error
      • FAQ Page
      • Staff Directory
      • No Sidebars
      • Two Sidebars
      • Two Sidebars Left
      • Contact 1
      • Contact 2
      • Contact 3

Alerts

  1. Components
  2. Alerts
  • Basic Alert
  • Links in Alerts
  • Alerts with Headers
  • Icons in Alerts
  • Callout Style

Basic Alert

Well done! You successfully read this important alert message.
Heads up! This alert needs your attention, but it's not super important.
Warning! Better check yourself, you're not looking too good.
Oh snap! Change a few things up and try submitting again.
Default alert! A standard alert container.

Dismissible Alerts

Well done! You successfully read this important alert message.
Heads up! This alert needs your attention, but it's not super important.
Warning! Better check yourself, you're not looking too good.
Oh snap! Change a few things up and try submitting again.
Default alert! A standard alert container.

Links in Alerts

Well done! You successfully read this important alert message.
Heads up! This alert needs your attention, but it's not super important.
Warning! Better check yourself, you're not looking too good.
Oh snap! Change a few things up and try submitting again.
Default alert! A standard alert container.

Alerts with Headers

This is a header

Well done! You successfully read this important alert message.

This is a header

Heads up! This alert needs your attention, but it's not super important.

This is a header

Warning! Better check yourself, you're not looking too good.

This is a header

Oh snap! Change a few things up and try submitting again.

This is a header

Default alert! A standard alert container.

Icons in Alerts

Well done! You successfully read this important alert message.
Heads up! This alert needs your attention, but it's not super important.
Warning! Better check yourself, you're not looking too good.
Oh snap! Change a few things up and try submitting again.
Default alert! A standard alert container.

Callout Style

Well done! You successfully read this important alert message.
Heads up! This alert needs your attention, but it's not super important.
Warning! Better check yourself, you're not looking too good.
Oh snap! Change a few things up and try submitting again.
Default alert! A standard alert container.

This is a header

You successfully read this important alert message.

This is a header

This alert needs your attention, but it's not super important.

This is a header

Better check yourself, you're not looking too good.

This is a header

Change a few things up and try submitting again.

This is a header

A standard alert container.

This is a header

You successfully read this important alert message.

This is a header

This alert needs your attention, but it's not super important.

This is a header

Better check yourself, you're not looking too good.

This is a header

Change a few things up and try submitting again.

This is a header

A standard alert container.

This is a header

You successfully read this important alert message.

This is a header

This alert needs your attention, but it's not super important.

This is a header

Better check yourself, you're not looking too good.

This is a header

Change a few things up and try submitting again.

This is a header

A standard alert container.
The University of Alabama
  • Link 1
  • Link 2
  • Link 3
  • Link 4
  • Link 5
  • Link 6
  • Link 7

Copyright © 2016 The University of Alabama | Disclaimer | Privacy