使divs自动填充空间

Question

所以我一直想在这里找出我的div的问题; 如何将我的设计转化为实际布局,而且我在研究或实施方面没有太多运气.在附加的链接中,您看到// PORTFOLIO,然后是一条延伸到内容区域边缘的线,这里有一条红线.现在我将// PORTFOLIO和红线div设置为特定的像素宽度,但我希望能够让两个div自动设置它们的宽度(第一个根据//自动设置宽度// TITLE占用,第二个占用容器中的剩余空间),因为我会让网站的其他部分做同样的事情,并且不想专门针对每个区域进行测量.非常欢迎任何建议,非常感谢!

例

Answer 1

请参阅: http ://jsfiddle.net/GmtMK/1/ (更改浏览器窗口的宽度)

<div id="columnA">
    <div id="title">//Portfolio</div>
    <div id="line"></div>
</div>

#columnA {
    font-family: 'ProximaNovaRegular', Geneva, sans-serif;
    font-size: 19px;
    text-transform: uppercase;
    color: #C10000;
    margin-bottom: 20px;
    letter-spacing: 4pt;
}
#title {
    float: left
}
#line {
    overflow: hidden;
    height: 9px;
    border-bottom: 1px solid #c10000;
}