.wall { display: block; position: relative } .wall-column { display: block; position: relative; width: 33.3333%; float: left; padding: 0 0.8%; box-sizing: border-box } .article { display: block; margin: 0 0 6%; background: #fff; border-radius: 3px; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05); transition: all 100; overflow: hidden; position: relative; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear; -ms-transition: all 0.2s linear; transition: all 0.2s linear; } .article:hover { transform: scale(1.01) } .article img { display: block; width: 100%; margin: 0 0 5% } .article a { color: #666 } .article .txtk{ width:100%; padding: 5%; } .article h6{ width:100%; background-color: #eee; text-align: right; padding:10px 5%; border-top: solid 1px #ddd; color:#999; font-size: 12px; } @media only screen and (max-width: 1200px) { .wall-column { width:50%; } .article .txtk{ font-size: 13px; line-height: 22px; } .article { margin: 0 0 4%; } } @media only screen and (max-width:750px) { .wall-column { width:100%; } .article { margin: 0 0 15px; } }