Как применить, чтобы код для Tilda работал только на десктопной версии?

Question

Как применить, чтобы код для Tilda работал только на десктопной версии?

Анастасия Бурыкина Ученик (173), на голосовании 1 год назад

Применила код, для несколько столбцов для формы, но на мобильной версии этот вариант не устроил. Посоветовали код для применение для мобильной версии, перестал работать основной код для декстопа. ХЭЛП)
Вот весь код
<style>
.tn-elem__6105509931688051634992 .t-form__inputsbox {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
align-items: flex-start;
}
.tn-elem__6105509931688051634992 .t-input-group {
flex: 50% 0 0;
padding: 0 15px;
box-sizing: border-box;
}
.tn-elem__6105509931688051634992 .tn-form__submit {
margin-left: 15px;
flex: 100% 0 0;
</style>
<style>
.tn-elem__6105509931688051634992 .tn-form__submit {
display: flex;
flex-flow: row nowrap;
justify-content: center;
}
</style>

Answer 1

Dlazder Мудрец (16929) 1 год назад

раз есть возможность добавлять стили, то тут и JS не нужен, используй media query.

Анастасия БурыкинаУченик (173) 1 год назад

А можете написать код?

Dlazder Мудрец (16929) Анастасия Бурыкина, откуда я знаю что тебе нужно сделать? код который ты скинул сверху это верстка которую нужно применить?

Анастасия БурыкинаУченик (173) 1 год назад

Да. Это код для того чтобы из формы вертикальной в один столбец, сделать два столбца. Мне именно нужно что бы код работал только на декстопе, а на мобилке как была форма в один столбец, так и осталась

Dlazder Мудрец (16929) Анастасия Бурыкина, оборачиваешь код в медиа запрос. Соответственно меняешь значение 1440px на нужное, начиная от которого данные правила будут работать.

 @media (min-width: 1440px) {
.tn-elem__6105509931688051634992 .t-form__inputsbox {  
display: flex;  
flex-flow: row wrap;  
justify-content: space-between;  
align-items: flex-start;  
}  
.tn-elem__6105509931688051634992 .t-input-group {  
flex: 50% 0 0;  
padding: 0 15px;  
box-sizing: border-box;  
}  
.tn-elem__6105509931688051634992 .tn-form__submit {  
margin-left: 15px;  
flex: 100% 0 0;  
  
MailО компанииРекламаВакансии