-
ppgeducacao.uepgAsked on February 3, 2021 at 8:48 AM
Gostaria de saber se existe alguma maneira de configurar as caixas de inserção da Lista Configurável para colocar elas uma embaixo da outra e não lado a lado (como na imagem abaixo). Para que essa barra de rolagem horizontal não apareça.
É possível fazer isso no CSS?
Desde já obrigado -
Eduardo JotForm SupportReplied on February 3, 2021 at 10:33 AM
Olá, ppgeducacao.uepg
Para alinhar verticalmente os itens do widget Lista Configurável siga os passos abaixo:
1) Insira o seguinte código CSS customizado em seu formulário:
[data-widget-name="Configurable List"] > iframe {
width: 100% !important;
}
Veja aqui as instruções:
Guia: Como-inserir-codigos-css-personalizados
2) Insira o seguinte código CSS customizado em seus widgets de Lista Configurável
#list tbody:first-child > tr:first-child {
display: none;
}
#list {
width: 100%;
border-collapse: collapse;
}
#list tbody:first-child > tr > td{
display:block;
padding: 6px 0;
}
#list tbody:first-child > tr + tr + tr {
border-top: 1px solid #ccc;
}
#list > tbody:first-child tr td.col1 {
padding-top: 20px;
}
.mobileColumnName {
display: inline-block;
padding-bottom: 4px;
width: 40%;
box-sizing: border-box;
}
.mobileColumnName + input,
.mobileColumnName + textarea,
.mobileColumnName + select,
.mobileColumnName + .radio-container,
.mobileColumnName + .checkbox-container,
.mobileColumnName + .dateContainer {
width: 60%;
display: inline-block;
box-sizing: border-box;
vertical-align:top;
box-shadow:none;
}
.buttonsColumn {
text-align: right;
}
Veja aqui as instruções (em inglês):
Guide: How-to-inject-css-codes-to-widgets
Precisando de qualquer assistência neste processo estamos à disposição.
-
ppgeducacao.uepgReplied on February 5, 2021 at 12:10 PM
ajudaram demais, muito obrigado mesmo!