Как сделать 3 блока До/После GL09 на одной строке в Tilda
Contacts
3 months with a Health Coach
Start working on your body today, and with our individual fitness program, already
in 90 days you will see a totally different girl in the mirror!
Before | After

Как сделать 3 блока До/После GL09 на одной строке в Tilda

1
Добавили на страницу блоки GL09 друг за другом
2
Задали ширину блоков 6 колонок, без отступа слева
отступ сверху 90px, снизу 0
3
Добавили код на страницу, в блок Другое - Т123
Mo-ti Level Up
Видео инструкции по добавлению кода и работе с Zero Block.
Получить полное видео
Посмотреть все видео
Меняем расположение блока GL09 в две или три колонки, задаём общий цвет фона.
Длительность видео: 24 мин
Фрагмент видео
Посмотреть видео в личном кабинете ►
Библиотека для примера

<style>
div[data-record-type="410"] {
   width: calc(100%/3); /*3-кол-во в ряду*/
   padding: 0 20px;
   box-sizing: border-box;
}
.glwrapper {
    background-color: #f3f3f3;
    padding-top: 10px;
    padding-bottom: 100px;
}
.maingl {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.t410 .t-col {
    margin:0 auto;
    float: none;
    display: block;
}
.maingl:before, .maingl:after{
    display:none;
}
@media screen and (max-width: 1200px){
div[data-record-type="410"] { padding: 0 10px;}
}
@media screen and (max-width: 960px){
.maingl {display: block}
div[data-record-type="410"] { width: auto; padding: 0;}
}
</style>

<script>
$(document).ready(function(){
    if($(window).width()>960){
    $('div[data-record-type="410"]').wrapAll('<div class="glwrapper"><div class="maingl t-container"></div></div>');
    };
});
</script>
Made on
Tilda