bootstrap: how to make an alert take the width of its content

twitter-bootstrap-3

Solution

Try this..

.alert {display:inline-block;}

Demo: http://www.bootply.com/124763

Note, that this approach will change behaviour of all alerts. If you don't need it, you can add class:

.alert-auto {display:inline-block;}

and use it only where you need auto-width alert.

Problem

How to make an alert take the width of its content? This div will take all the available space while I would like it to be only as long as my text. ``` <div class="alert alert-info"> <span class="glyphicon icon-info"></span> My text. </div> ```

Original source