HTML代碼：

<div class="ct">
  <div class="left">left</div>
  <div class="right">right</div>
   <div class="main">main</div>
</div>

CSS代碼：

.left,
.right {
  width: 100px;
  height: 100px;
}
.left {
  background: blue;
  float: left;
}
.right {
  background: green;
  float: right;
}
.main {
  background: red;
  height: 100px;
  margin: 0 100px;
}

因?yàn)榻o.main設(shè)置了width:100%，所以把后面的.left與.right都擠到下一行去了唄。
你把.main設(shè)置成width:calc(100% - 100px);和width:calc(100% - 99px);對(duì)比下吧。

.main {
  background: red;
  float: left;
  height: 100px;
  width: 100%;
/*   margin-left: 50px ; */
  margin-right: 
 
}

因?yàn)槟惆裮ain設(shè)置了width:100;所以被擠下去了，如果想讓他們?cè)谝恍?，又要保?00%，可以在main設(shè)置

margin-left:-200px;

同時(shí)right去掉

margin-left: -510px;