> For the complete documentation index, see [llms.txt](https://shenjunhong.gitbook.io/blog/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://shenjunhong.gitbook.io/blog/html-and-css/css-zuo-bian-ding-kuan.md).

# 两栏布局

```js
* css{

  .left {
    width: 100px;
    height: 100px;
    float: left;
    background-color: rgb(68, 156, 28);
  }
  .right {
    width: 100%;
    height: 100px;
    background-color: rgb(25, 39, 161);
    overflow: hidden
  }
}

* css{

  .app{
    display: flex;
    .left {
      width: 100px;
      height: 100px;
      background-color: rgb(68, 156, 28);
    }
    .right {
      width: 100%;
      height: 100px;
      background-color: rgb(25, 39, 161);
    }

  }
}

* css {
    width : 100%;
    float: left
    .right:{
      margin-left: 200px
    }
    .left{
      float: left;
      margin-left: -100%;
    }
}
```