左侧列必须有一个最小宽度，例如200px，宽度：25%。

右侧列宽度：75%

<style>
.outer {
    width: 100%;
    border: 1px solid black;
}
.left, .right {
    display:inline-block;
}
.left {
    min-width: 200px;
    width: 25%;
    background-color: #dcc2c2;
}
.right {
    width: 75%;
    background-color: #d0dee8;
}
</style>

    <div class="outer">
        <div class="left">left</div>
        <div class="right">right</div>
    </div>

在调整大小时达到最小宽度之前，列并排放置，这是我想要的，但一旦最小宽度开始，右列就会落在下一行上。

我怎样才能使右边的列缩小而不落在下一行上呢？

链接到JSFiddle