css:两个div，一个固定宽度，另一个固定宽度

See: http://jsfiddle.net/SpSjL/（调整浏览器的宽度）

HTML:

<div class="right"></div>
<div class="left"></div>

CSS:

.left {
    overflow: hidden;
    min-height: 50px;
    border: 2px dashed #f0f;
}
.right {
    float: right;
    width: 250px;
    min-height: 50px;
    margin-left: 10px;
    border: 2px dashed #00f;
}

---

您也可以使用 display: table ，这通常是一种更好的方法：如何将输入元素与其标签放在同一行？

您可以使用CSS的calc（）函数。

演示：http://jsfiddle.net/A8zLy/543/

<div class="left"></div>
<div class="right"></div>
.left {
height:200px;
width:calc(100% - 200px);
background:blue;
float:left;
}
.right {
width:200px;
height:200px;
background:red;
float:right;   
}

希望这对您有帮助！

这是2017年，最好的方法是使用与IE10 +兼容的flexbox。

.box {
  display: flex;
}
.left {
  flex: 1;  /* grow */
  border: 1px dashed #f0f;
}
.right {
  flex: 0 0 250px; /* do not grow, do not shrink, start at 250px */
  border: 1px dashed #00f;
}

<div class="box">
  <div class="left">Left</div>
  <div class="right">Right 250px</div>
</div>

如果您可以在源代码中翻转订单，则可以这样做：

HTML：

<div class="right"></div> // needs to be 250px    
<div class="left"></div>

CSS：

.right {
  width: 250px;
  float: right;
}  

示例：http://jsfiddle.net/blineberry/VHcPT/

添加一个容器，您可以按照当前的源代码顺序和绝对位置进行操作：

HTML：

<div id="container">
  <div class="left"></div>
  <div class="right"></div>
</div>

CSS：

#container {
  /* set a width %, ems, px, whatever */
  position: relative;
}
.left {
  position: absolute;
  top: 0;
  left: 0;
  right: 250px;
}
.right {
  position: absolute;
  background: red;
  width: 250px;
  top: 0;
  right: 0;
}

在这里， .left div从 top中隐式设置宽度 ， left 和 right 可以填充 #container剩余空间的样式

示例：http://jsfiddle.net/blineberry/VHcPT/3/

如果可以将它们包装在容器 <div>中 您可以使用定位来使左侧 <div> 停在 left:0;right:250px ，请参见 this demo .我现在要说的是，这在IE6中不起作用，因为它只是 <div>的一个角 可以完全放在页面上（有关完整说明，请参见此处）。