+---------------+  +------------------------/
 | float: left;  |  | float: right;
 |               |  |                        /
 |               |  |content stretching         Screen Edge
 |               |  |the div off the screen  /  <---
 +---------------+  +------------------------
                                             /

.minwidth { min-width:100px; width: auto !important; width: 100px; }

.parent {
     white-space: nowrap;
}

.child {
    display:inline-block;
    width:300px;
    white-space: normal;
}

.floated {
    float: left;
    ...
    box-sizing: border-box;
}

<div class="floatNoWrap">
    <div id="A" style="float: left;">
        Content A
    </div>
    <div id="B" style="float: left;">
        Content B
    </div>
    <div style="clear: both;"></div>
</div>

.floatNoWrap
{
    width: 100%;
    height: 100%;
}

$("[class~='floatNoWrap']").each(function () {
    $(this).css("width", $(this).outerWidth());
});