html 宽度(100% -n px)？

Question

在 HTML 页面上，我有两列。我将第 1 列的宽度设置为 75%，将第 2 列的宽度设置为 25%。我使用 style='width:75%;' 设置宽度。我的列设置为 div，据我所知，使用表格进行布局被认为是不好的做法。

我的问题是，我能否让一列具有固定宽度(例如 200 像素)，而另一列自动占据浏览器窗口的剩余宽度？

Answer 1

通常，您可以通过使用边距非常简单地实现这一点。这方面的一个例子如下:

 #wrapper { overflow:hidden; }

 #right 
 {
     float:right;
     display:inline;
     width: [Fixed Width]px;
 }

 #left 
 {
     margin-right:[Fixed Width]px;
     display:inline;
 }

然后HTML标记如下:

 <div id="wrapper">
     <div id="right">Test</div>
     <div id="left">Test</div>
 </div>

这将适用于 IE6+ 以及我所知道的所有主要浏览器。如果您希望在 IE6 中使用“display:inline”，则可以添加额外的边距。

之所以可行，是因为 float 从页面的正常流动中取出，因此“#left”将始终占用任何可用空间。包装器是一种快速清除技巧。