HTML/CSS使3div以灵活的宽度排列在一起

Question

我试图对齐3div在彼此旁边，有两个灵活的宽度和一个固定的宽度。请参阅以下弹琴：http://jsfiddle.net/qyGC5/82/

我看过这篇文章：Three DIVs next to each other with fluid horizontal width，但它不适用于2个灵活的div，甚至只有一个灵活的宽度(长文本)。http://jsfiddle.net/qyGC5/89/

我也认为百分比，但由于使用100%是不可能的，差距将变得更大或更小的调整。

任何帮助，非常感谢。谢谢。

编辑了，添加了一些屏幕截图，以显示在ajax加载新注释后发生了什么(这是显示注释)

在AJAX加载更多注释之前

​

在AJAX加载之后

​

Answer 1

忘记使用display: inline-block来完成这个任务吧。

使用float: left on .sides and overflow: hidden on #main。

见： http://jsfiddle.net/qyGC5/93/

<div class="sides">side 1</div>
<div class="sides">side 2</div>
<div id="main">Lorem ipsum..</div>

.sides {
    width: 30px;
    border: 2px dotted green;

    float: left;
}
#main {
    border: 2px dotted blue;

    overflow: hidden;
}