3列布局：中间有最大宽度，右侧列是动态的

Question

是否有可能创建这样的CSS布局没有javascript？

• 左栏：宽度为23％
• 中间列：宽度43.5％，最大宽度是550px
• 右列：动态的（伸展到​​容器的宽度）

的主要问题是中柱的最大宽度。如果宽度达到最大值，不知道如何使右列动态变化并将其粘贴到中栏右边缘。

Answer 1

我开始试验约30分钟你问的问题后，再放弃了，但在最后div（感谢@MrAlien）不具有float的想法使我的工作，例如：http://jsfiddle.net/6pJJt/3/。

HTML：

<div id="col1" class="column">Column 1</div> 
<div id="col2" class="column">Column 2</div> 
<div id="col3" class="column">Column 3</div> 

CSS：

html, body { 
    margin: 0; 
    padding: 0; 
    width: 100%; 
    height: 100% 
} 
.column { 
    height: 100%; 
    float: left 
} 
#col1 { 
    width: 23%; 
    background: red 
} 
#col2 { 
    width: 43.5%; 
    max-width: 550px; 
    background: orange 
} 
#col3 { 
    width: 100%; 
    background: yellow; 
    float: none 
}