How can I make a div not larger than its contents?

Question

I have a layout similar to:

I would like for the div to only exp

Answer 1

We can use any of the two ways on the div element:

display: table;

or,

display: inline-block; 

I prefer to use display: table;, because it handles, all extra spaces on its own. While display: inline-block needs some extra space fixing.