How To Remove Extra Space Caused By Word-wrap In Shrunk To Fit Element?

I am trying to use shrink to fit on #container. It works perfectly until the elements it contains wrap. This causes it to expand to 180px. CSS: #screen-dimensions { width: 250

Solution 1:

Try using:

{
  display: inline-flex;
}

Solution 2:

I achieved that by playing around with the display properties:

#container
{
    display: inline-block;
}
#container > div
{
    display: block;
}

See: http://jsfiddle.net/feeela/Anc3v/