Div same width as its content
HTML
<div>
<h1>Div with same width as its content</h1>
<h2>div {display: inline-block;}
</h2>
</div>
CSS
div {
background: #ccc;
display: inline-block;
margin: auto;
}
/* fiddle styles */
body {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
overflow: hidden;
font-family: sans-serif;
text-align: center;
}
h2 { color: white;}