<!DOCTYPE html> <head> <style> * { margin: 0; padding: 0; } #container1 { background-color: orange; } #left { float: left; width: 150px; } #container2 { margin-left: 150px; background-color: yellow; } #right { float: right; width: 150px; } #main { margin-right: 150px; background-color: silver; } .end { clear: both; } </style> </head> <body> <div id='container1'> <div id='left'> <p>Left</p> <div class='end'></div> </div> <div id='container2'> <div id='right'> <p>Right</p> <div class='end'></div> </div> <div id='main'> <p>Main</p> <div class='end'></div> </div> <div class='end'></div> </div> <div class='end'></div> </div> </body> </html>
