* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } body { font-family: sans-serif; } .container { background: #EEE; width: 180px; margin-bottom: 20px; position: relative; } .container:after { content: ''; display: block; clear: both; } .item { width: 60px; height: 30px; float: left; border: 1px solid; background: #3BF; } .item.w2 { width: 120px; } .item.w3 { width: 180px; } .item.h2 { height: 50px; } .item.h3 { height: 70px; } .item.h4 { height: 90px; } .item.h5 { height: 110px; } /* ---- stamp ---- */ .stamp { background: red; opacity: 0.75; position: absolute; border: 1px solid; } .has-stamp { position: relative; } /* ---- get segment size ---- */ #get-segment-size .grid-sizer { /* 57 outer width */ width: 52px; margin-right: 5px; /* 47 outer height */ height: 40px; margin-bottom: 7px; } #masonry-measure-columns .grid-sizer { width: 70px; } /* ---- masonry stamp ---- */ #masonry-stamp .stamp1 { width: 80px; height: 30px; right: 25px; top: 15px; }