CSS負邊距，我做錯了什麼？

Question

我試圖實現1列靈活/ 1列固定佈局。 'col-a'應該是靈活的，佔用100％ - 110px，'col-b'應該固定並對齊。

我'試圖使用負邊距，但有一點運氣。

<div class="cont"> 

    <div class="col-a"> 
    Be flexible 
    </div> 

    <div class="col-b"> 
    Be fixed 
    </div> 

</div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​ 

.cont { 
background-color: #00f; 
padding: 10px; 
overflow:hidden; 
} 

.col-a { 
background-color: #0ff; 
padding-right: 110px; 
margin-right: -110px; 
float: left; 
} 

.col-b { 
background-color: #ff0; 
width: 110px; 
float: left; 
} 

是否可以使用這種標記？ /*答發現*/ 下面是解

.cont { 
    background-color: #00f; 
    overflow:hidden; 
    padding: 10px; 
} 

.col-a { 
    width: 100%; 
    background-color: #0ff; 
    margin-right: -110px; 
    float: left; 
} 

.col-b { 
    background-color: #ff0; 
    width: 110px; 
    float: right; 
} 

Answer 1

我不會用陰性切緣此。

這是我如何設置它。

1. 將您的列父容器設置爲相對位置。
2. 設置您的列A有一個110px的填充右邊（爲B列留出空間）
3. 將您的列B設置爲絕對位於頂部，右側的固定寬度爲110px。

這將使你的A柱水平擴展100％，而對B列

這裏右邊留出空間是什麼，我上面列出的例子：http://jsfiddle.net/NPn8d/

Answer 2

如何像這個，然後。

<style type="text/css"> 
    .cont{position:relative;} 
    .col-a{ 
      border:1px solid #0000ff; 
      width:auto; 
      margin:0,110,0,0; 
      } 
    .col-b{ 
      border:1px solid #ff0000; 
      width:110px; 
      float:right; 
      top:0; 
      position:absolute; 
      margin:0,0,0,-110 
    } 
</style> 
<div class="cont"> 
    <div class="col-a">Be flexible</div> 
    <div class="col-b">Be fixed</div> 
</div>