圣杯布局和双飞翼布局 margin-left:-100%

---

前言

圣杯布局和双飞翼布局就是左右固定宽度，中间自适应宽度。

---

一、圣杯布局

1、先写middle

<div class="container">
	<div class="middle">middle</div>
    <div class="left">left</div>
    <div class="right">right</div>
</div>

2、container设置padding ，预留位置给左右

3、middle设置宽度100%

4、left、right设置固定宽度200px

    .container {
   
      padding-left: 200px;
      padding-right: 200px;
    }
    .middle {
   
      width: 100%;
      background-color: yellow;
    }

    .left {
   
      width