今天去阿里面试的时候被问到这个了。。。当时表示没听说过，然后让面试官给我解释了一下，回来继续补习。
首先上代码：
<!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> .main { background:#D6D6D6; } .left { background:#E79F6D; } .right { background:#7BD; } /* core layout css */ .main { float:left; width:100%; } .left { float:left; width:190px; margin-left:-100%; } .right { float:left; width:230px; margin-left:-230px; } .in{margin:0 230px 0 190px} </style> </head> <body> <div id="bd"> <div class="main"><div class="in">test11111111111</div></div> <div class="left">test11111111111</div> <div class="right">test11111111111</div> </div> </body> </html>
核心思想是利用margin负边距进行挤呀挤：
负边距 margin-left为负值，且两个元素不在一行的时候（可以用元素float:left,100%实现）margin-left可以吃掉兄弟元素的margin.