You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
|
|
|
* {
|
|
|
|
-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 {
|
|
|
|
background: red;
|
|
|
|
opacity: 0.75;
|
|
|
|
position: absolute;
|
|
|
|
border: 1px solid;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* ---- stamp ---- */
|
|
|
|
|
|
|
|
.has-stamp .item { width: 45px; }
|
|
|
|
|
|
|
|
/* stout, in the middle */
|
|
|
|
.has-stamp .stamp1 {
|
|
|
|
width: 40px;
|
|
|
|
height: 30px;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* really wide */
|
|
|
|
.has-stamp .stamp2 {
|
|
|
|
width: 200px;
|
|
|
|
height: 20px;
|
|
|
|
}
|