分割屏幕为2个div并设置第二个宽度,其余空间为css？

Question

我有2个块内联div.

我不想指定第一个的宽度,但是,我希望第二个占用剩余空间的100%.两个div的容器占据了我的屏幕的100%.

似乎可以使用jQuery来确定第一个div的宽度并设置第二个值,但我想在纯css中完成它.

我怎样才能做到这一点 ？

Answer 1

div.box {
  background: #EEE;
  height: 100px;
  width: 600px;
}

div.div1 {
  background: #999;
  float: left;
  height: 100%;
  width: auto;
}

div.div2 {
  background: #666;
  height: 100%;
}

div.clear {
  clear: both;
  height: 1px;
  overflow: hidden;
  font-size: 0pt;
  margin-top: -1px;
}

<div class="box">
   <div class="div1">1st</div>
   <div class="div2">2nd</div>
   <div class="clear">
</div>

希望它有所帮助.