<!DOCTYPE html> <html> <head> <style type="text/css"> #div_t3d_1 { position: absolute; background-color: red; top: 10px; left: 10px; width: 40px; height: 40px; } #div_t3d_2 { position: absolute; background-color: green; top: 20px; left: 20px; width: 20px; height: 20px; } #div_t3d_3 { position: absolute; background-color: red; top: 10px; left: 60px; width: 40px; height: 40px; } #div_t3d_4 { position: absolute; background-color: green; top: 20px; left: 5px; width: 20px; height: 20px; } #div_s3d_1 { position: absolute; background-color: red; top: 10px; left: 110px; width: 40px; height: 40px; } #div_s3d_2 { position: absolute; background-color: green; top: 0; left: 15px; width: 10px; height: 40px; } #div_r3d_1 { position: absolute; background-color: red; top: 60px; left: 10px; width: 40px; height: 40px; } #div_r3d_2 { position: absolute; background-color: green; top: 15px; left: 5px; width: 20px; height: 10px; } #div_r3d_3 { position: absolute; background-color: red; top: 60px; left: 60px; width: 40px; height: 40px; } #div_r3d_4 { position: absolute; background-color: green; top: 15px; left: 5px; width: 20px; height: 10px; } </style> </head> <body> <div id="div_t3d_1"> <div id="div_t3d_2"> </div> </div> <div id="div_t3d_3"> <div id="div_t3d_4"> </div> </div> <div id="div_s3d_1"> <div id="div_s3d_2"> </div> </div> <div id="div_r3d_1"> <div id="div_r3d_2"> </div> </div> <div id="div_r3d_3"> <div id="div_r3d_4"> </div> </div> </body> </html>