当前位置 : 主页 > 网页制作 > css >

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

来源:互联网 收集:自由互联 发布时间:2021-06-13
我有2个块内联div. 我不想指定第一个的宽度,但是,我希望第二个占用剩余空间的100%.两个div的容器占据了我的屏幕的100%. 似乎可以使用jQuery来确定第一个div的宽度并设置第二个值,但我
我有2个块内联div.

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

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

我怎样才能做到这一点 ?

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>

希望它有所帮助.

网友评论