用margin实现两列布局中的自适应列

Posted 2020-06-14

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了用margin实现两列布局中的自适应列相关的知识，希望对你有一定的参考价值。

<div id="wrapper">
    <div id="col1">
      "fixed"
    </div>
    <div id="col2">
      "fluid"
    </div>
</div>

#wrapper{background:red;float:left;width:90%;height:200px;padding:5px}

#col1{
  float:left;
  width:100px;
  height:100%;
  background:green;
}
#col2{background:green;height:100%;margin-left:110px;margin-right:0px;}

http://jsfiddle.net/rhw0z1bj/

以上是关于用margin实现两列布局中的自适应列的主要内容，如果未能解决你的问题，请参考以下文章

两列布局中单列定宽单列自适应布局的5种思路