Форматирование макета контактной формы 7 WordPressCSS

Разбираемся в CSS
Ответить
Anonymous
 Форматирование макета контактной формы 7 WordPress

Сообщение Anonymous »

Здравствуйте, у меня есть следующая форма в WordPress с плагином КОНТАКТНАЯ ФОРМА 7:

Код: Выделить всё

/** CSS per contact form —**/
#responsive-form-loud{
max-width:600px /*– cambia questo con la larghezza desiderata –*/;
margin:0 auto;
width:100%;
}

.form-row{
width: 100%;
}

.column-half, .column-full{
float: left;
position: relative;
padding: 0.65rem;
width:100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box
}

.clearfix:after {
content: “”;
display: table;
clear: both;
}

/**—————- Media query —————-**/
@media only screen and (min-width: 48em) {
.column-half{
width: 50%;
}
}

/**—————- Per spostare il bottone invio a destra —————-**/

.wpcf7-submit{
float: right;
}

/**—————- Per cambiare il colore del bottone —————-**/
.wpcf7-submit{
background: #1d3e83/*– colore sfondo –*/;
color: #fff!important;
/*– colore testo –*/
width: 150px!important;
height: 40px!important;
}

/**—————- Colore del bottone con il passaggio del mouse —————-**/
.wpcf7-submit:hover{
background: #f6dc52;
color: #1d3e83!important;
}

/**—————- Per personalizzare il messaggio di successo —————-**/

div.wpcf7-mail-sent-ok {
text-shadow: none;
border: none;
background: #8BC34A;
color: black!important;
font-family: ‘Raleway’;
}

Код: Выделить всё




 * Stazione Appaltante / Committente [/b] [b]            [text* stazione-appaltante]




 * Appalto di: [/b] [b]            [radio radio-appalto use_label_element default:1 "Lavori" "Servizi" "Forniture"]




 * Oggetto appalto: [/b] [b]            [text* your-subject]




 * Fase: [/b] [b]            [radio radio-fase use_label_element default:1 "Gara" "Esecuzione"]




[group group-esecuzione inline][select
menu-fase "Indagine di mercato/Manifestazione d'interesse" "Procedura negoziata" "Procedura aperta"
"Partenariato pubblico privato / Concessioni"
][/group]




 * Anomalia rilevata: [/b] [b]            [textarea* textarea-anomalia]




Allega file (facoltativo): 
[file file-upload filetypes: filetypes:image/*|txt|application/pdf]

 Eventuale disponibilità a sottoscrivere istanze in autotutela o ricorsi o richieste di
pareri
ANAC: [/b][b]            
[radio radio-istanze use_label_element default:1 "Si" "No"]




  Riferimenti del soggetto che effettua la segnalazione (facoltativo): [/b]  [b]



Nome 
[text nome]

Cognome 
[text cognome]




Ragione sociale 
[text ragione]

Codice fiscale 
[text codfisc]




Email 
[email email-email]

 * Impresa già associata Federappalti: [/b] [b]            [radio radio-associata use_label_element default:1 "Si" "No"]




[acceptance your-consent "Accetto di inviare i dati compilati all'interno del seguente modulo."]




* Campi obbligatori




[submit "Invia"]





Код: Выделить всё






  [list][/list]


















 * Stazione Appaltante / Committente [/b] [b]            




 * Appalto di: [/b]  [b]            LavoriServiziForniture




 * Oggetto appalto: [/b] [b]            




 * Fase: [/b] [b]            GaraEsecuzione




Indagine di mercato/Manifestazione d'interesseProcedura negoziataProcedura apertaPartenariato pubblico privato / Concessioni




 * Anomalia rilevata: [/b] [b]            




Allega file (facoltativo): 


  Eventuale disponibilità a sottoscrivere istanze in autotutela o ricorsi o richieste di
pareri
ANAC: [/b][b]            
SiNo




  Riferimenti del soggetto che effettua la segnalazione (facoltativo): [/b] [b]



Nome 


Cognome 





Ragione sociale 


Codice fiscale 





Email 


 * Impresa già associata Federappalti: [/b]  
SiNo




Accetto di inviare i dati compilati all'interno del seguente modulo.




* Campi obbligatori
















у меня 2 проблемы:
  • переключатели отображаются вертикально, но мне нужно горизонтально.
  • когда форма отправляется (с успехом или с ошибкой в ​​каком-то поле), оранжевое поле с ошибкой сообщение охватывает не всю форму, а только ее часть.
    Я проверил все элементы div и, кажется, все в порядке.
    Заранее спасибо за помощь
экран сообщения об ошибке

Подробнее здесь: https://stackoverflow.com/questions/793 ... -wordpress
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «CSS»