код для такого выравнивания
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
.block { height: 250px; padding: 30px 30px 45px; width: -webkit-calc(25% - 31.25px); width: calc(25% - 31.25px); float: left; margin-left: 25px; margin-bottom: 25px; } .block.block_xl { height: 485px; width: -webkit-calc(50% - 37.5px); width: calc(50% - 37.5px); float: left; margin-left: 25px; } .block.block_lg { height: 210px; width: -webkit-calc(50% - 37.5px); width: calc(50% - 37.5px); float: left; margin-left: 25px; } |
html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
<div> <a class="main-foto-a block block_xl " style="background: no-repeat url(/upload/iblock/fe6/gal10.jpg) center center; background-size: cover;" href="" tabindex="0"> </a> <a class="main-foto-a block " style="background: no-repeat url(/upload/iblock/62c/gal9.jpg) center center; background-size: cover;" href="" tabindex="0"> </a> <a class="main-foto-a block " style="background: no-repeat url(/upload/iblock/dc1/gal8.jpg) center center; background-size: cover;" href="" tabindex="0"> </a> <a class="main-foto-a block block_lg " style="background: no-repeat url(/upload/iblock/36b/gal7.jpg) center center; background-size: cover;" href="" tabindex="0"> <a class="main-foto-a block " style="background: no-repeat url(/upload/iblock/475/gal6.jpg) center center; background-size: cover;" href="" tabindex="0"> </a> <a class="main-slider-a" style="background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), no-repeat url() center center; background-size: cover;" href="" tabindex="0"> </a> </div> |