CSS两个布局和表问题

Question

嗨，我有以下HTML：

<div id="CONTENT"> 
    <div id="SIDEBAR"></div> 
    <div id="MAIN"> 
    <table> 
    <tr> 
     <td> 
      <div><label><span><a><span>My Label</span></a></span></label><span class="colon">:</span></div></td> 
     <td>hsadnsdjfjkasdfhkjadshfjkahsdkfjhasdjkfhjkasdhfjkaf</td> 
    </tr> 
    <tr> 
     <td> 
      <div><label><span><a><span>My Label with a really long title</span></a></span><span class="colon">:</span></div></label> 
     </td> 
       <td>hsadnsdjfjkasdfhkjadshfjkahsdkfjhasdjkfhjkasdhfjkaf</td> 
    </tr> 
    <tr> 
     <td>  
      <div><label><span><a><span>My Label</span></a></span><span class="colon">:</span></div></label> 
</td> 
    <td><input value="hsadnsdjfjkasdfhkjadshfjkahsdkfjhasdjkfhjkasdhfjkaf" /></td> 

    </tr> 


      </table> 
     </div> 
</div> 

和我的CSS：

#CONTENT{ 
    font-size: 87%; 
    padding: 5px; 
} 
#SIDEBAR{ 
    width: 24em; float: left; margin-right: 0.5%;height: 200px; 
    border: 1px solid green; 
} 
#MAIN { 
    /*margin-left: 25em;*/ 
    border: 1px solid purple;float:right; 
} 

table div{ 
    position:relative; 
} 

.colon { 
    position: absolute; 
    right:0; 
} 

label { 
    margin-right: .4em; 
} 

在IE7中，如果你调整窗口的大小，使其更薄表似乎下移了页面。我想简单地展示一个像IE9和FF的滚动条。

活生生的例子：http://jsfiddle.net/aJsg2/19/

Answer 1

你需要设置样式表中的内容的最小宽度是什么侧边栏+主要内容的最小宽度。