<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style> .outer { padding: 2px; border: 1px solid black; background: #ddd; width: 200px; } .inner { width: 50px; height: 50px; background: yellow; } .foo { margin-left: 100px; margin-right: 50px; margin-top: 20px; margin-bottom: 5px; } .bar { margin-left: 50px; margin-right: 100px; margin-top: 5px; margin-bottom: 20px; } </style> </head> <body> <div class="outer"> <div class="inner foo"> </div> <hr> <div class="inner bar"> </div> </div> </body> </html>