CSS3 Arrow Buttons For Bootstrap

Category: CSS & CSS3 | February 28, 2017
2 Comments
Demo Download
Author:westonganger
Views Total:13,427 views
Official Page:Go to website
Last Update:February 28, 2017
License:MIT

Preview:

CSS3 Arrow Buttons For Bootstrap

Description:

A CSS extension for Bootstrap that makes it possible to create arrow (left and right) buttons using CSS3 transforms.

Preview:

Load the following CSS file bootstrap-directional-buttons.css after Bootstrap’s stylesheet.

<link href="bootstrap.min.css" rel="stylesheet">
<link href="bootstrap-directional-buttons.css" rel="stylesheet">

Add the CSS class ‘btn-arrow-left’ or ‘btn-arrow-right’ to the native Bootstrap buttons and done.

<button type="button" class="btn btn btn-default btn-arrow-left">Default</button>
<button type="button" class="btn btn-info btn-arrow-right">Info</button>

See Also:

You Might Be Interested In:

2 thoughts on “CSS3 Arrow Buttons For Bootstrap”

  1. Ashlynn

    so… whats in the “bootstrap-directional-buttons.css” that makes those arrows so pointy.
    With out that info the buttons will just turn out squares.

    Reply ↓

Leave a Reply