Fit to content for Bootstrap alert

I have a Bootstrap alert and I want the width to fit the content. In the Bootstrap documentation it appears the default is to have 100% width. What is the most robust way to make the alert exactly fit its content on all screen sizes?

<div class="container">
	<div class="alert alert-danger">
		My short alert message.
	</div>
</div>

You just need to add display: inline-block

Demo in Stack Snippets:

<!-- begin snippet: js hide: false console: false babel: false --> <!-- language: lang-css -->

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

<!-- language: lang-html -->

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.css">

<div class="container">
  <div class="alert alert-danger">
    Normal Alert Message
  </div>

  <div class="alert alert-danger alert-trim">
    Trimmed Alert Message
  </div>
</div>

<!-- end snippet -->

See Also: Is it really impossible to make a div fit its size to its content?