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

Question

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>

Answer 1

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.