Css实现左侧固定，右侧自动填充的两种方式

页面结构html

    
left
    
right

第一种方式：float

第二种方式：flex

.container{display: flex;}
.left{
    flex:none;
    background: olive;
    width:150px;
    height: 300px;
}
.right{
    flex:1;
    background: #df0;
    height: 300px;
}

展示效果，两种都是一样的

实际展示效果

---

当然还有别的很多实现方式，在此只记录两种常用的够用就行。