post #6417
Código CSS para Customizar Formulário RD
Publicado em: 09/09/2025 / Atualizado em: 12/09/2025
Código abaixo para customizar facilmente formulários da RD embutidos nos sites.
.bricks--component-embeddable-form [id^="rd-column-"] > div, .bricks--component-embeddable-form [id^="rd-section-"] {
background-color: transparent !important;
}
.rd-form form input, .rd-form form select, .rd-form form textarea, .rd-form form .bricks-form__input:not(textarea) {
height: 50px !important;
border-radius: 8px !important;
}
.rd-form form .bricks-form__field {
display: flex;
height: 102px;
flex-direction: column;
justify-content: flex-end;
}
.rd-form form label {
font-weight: bold !important;
}
.rd-form form .select2-container .select2-choice {
margin-top: 6px !important;
padding-left: 12px !important;
height: 48px !important;
border-radius: 8px !important;
}
.rd-form form .select2-container .select2-choice .flag {
margin-left: 8px !important;
margin-top: 2px !important;
border-radius: 4px !important;
}
.rd-form form .select2-chosen {
display: flex !important;
flex-direction: column !important;
align-items: flex-start !important;
justify-content: center !important;
}
.rd-form form .phone-country .select2-choice {
margin-top: 0px !important;
margin-left: 0px !important;
height: 0px !important;
border-radius: 0px !important;
}
.rd-form form .phone-country {
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
align-items: center !important;
}
.rd-form form .select2-container-active .select2-choice, .rd-form form .select2-container-active .select2-choices {
box-shadow: none !important;
outline: none !important;
}
.rd-form form .select2-container .select2-choice {
background: transparent !important;
}
.phone-input-group {
background: #fff;
border: 1px solid #ccc !important;
border-radius: 8px !important;
}
.rd-form form .with-select-flags > .phone-input-group > .phone {
border: none !important;
margin-left: -54px !important;
}
.rd-form form .select2-container .select2-choice {
margin-bottom: -6px !important;
}
.rd-form form span.select2-arrow {
display: none !important;
}
ul.select2-results li div {
display: flex !important;
flex-direction: row !important;
justify-content: flex-start !important;
align-items: center !important;
gap: 24px !important;
}
ul.select2-results li div .flag {
width: 40px !important;
}Publicações recomendadas:
Link Direto
Compartilhe esse conteudo nas redes sociais ou por mensagem usando o link direto abaixo. Basta copiar.
bruno.art.br/?p=6417
ID de Referência: 6417
Sugira uma publicação
Envie uma mensagem e sugira um publicação sobre um assunto que tenha dificuldades de resolver.