IE element width to min-content

Question

I have the following container holding both an image and a text element.

Answer 1

As mentioned by someone else you can use -ms-grid-columns. You just add a div around your content with IE only CSS. To other browsers the CSS is ignored and shouldn't affect your layout (unless you're applying CSS to all div elements like padding/margin in which case stop doing that).

HTML

    

        
        
            Cupcake ipsum dolor sit. 
            Amet chocolate carrot cake oat cake bear claw croissant.
        
    

CSS

.container 
{
    background-color: #EEEEEE;
    border: 1px solid #888888;
    padding: 0.3em;
    width: -moz-min-content;
    width: -webkit-min-content;
}
#stupidIE
{
    display: -ms-grid;
    -ms-grid-columns: min-content;
}

Here's the JSFiddle: http://jsfiddle.net/LRYSp/

Tested in Chrome and IE11. But it should work in other browsers. However I don't think it will render correctly in IE9 and below.