Riassunto AI
Vuoi eliminare lo spazio extra attorno alle tue immagini quando utilizzi le Scelte di Immagine per i tuoi campi modulo Checkbox o Scelta Multipla? Con poche righe di CSS, puoi ottenerlo senza sforzo, e noi siamo qui per guidarti attraverso il processo!
Creazione del modulo
Innanzitutto, inizia creando il tuo modulo in WPForms. Una volta creato il modulo, aggiungi i campi necessari, incluso il campo Scelta Multipla che servirà come base per la nostra configurazione delle Scelte di Immagine.
Se non sei sicuro su come impostare le Scelte di Immagine, puoi fare riferimento alla nostra documentazione su come aggiungere Scelte di Immagine a WPForms. Clicca semplicemente qui per istruzioni dettagliate.
Rimozione dello spazio bianco
Se non sei sicuro su come o dove aggiungere CSS al tuo sito, puoi fare riferimento a questo tutorial per una guida.
Per tutti i moduli
Per impostazione predefinita, quando aggiungi le Scelte di Immagine al tuo modulo, uno spazio bianco appare attorno all'immagine a causa del padding CSS. Questo spazio bianco può essere visto nell'immagine qui sotto:
Per rimuovere questo spazio bianco, dovrai copiare e incollare il seguente codice CSS sul tuo sito:
span.wpforms-image-choices-label {
display: none !important;
}
.wpforms-field-label-inline {
line-height: 0 !important;
}
label.wpforms-field-label-inline {
padding: 0 !important;
}
Questo codice CSS non solo rimuoverà lo spazio bianco attorno alle immagini, ma nasconderà anche le etichette associate a ciascuna immagine, permettendo alle immagini di risaltare da sole.
Per un modulo specifico
Per rimuovere questo spazio bianco per il modulo ID 1328, dovrai copiare e incollare il seguente codice CSS sul tuo sito:
form#wpforms-form-1328 span.wpforms-image-choices-label {
display: none !important;
}
form#wpforms-form-1328 .wpforms-field-label-inline {
line-height: 0 !important;
}
form#wpforms-form-1328 label.wpforms-field-label-inline {
padding: 0 !important;
}
Dovrai aggiornare il 1328 sopra per corrispondere al tuo ID modulo. Se non sei sicuro di dove trovare il tuo ID modulo, ti preghiamo di consultare questo articolo per ulteriore assistenza.
E questo è tutto! Hai rimosso con successo lo spazio bianco attorno alle immagini nel tuo modulo. Perché non dare un'occhiata ad altri articoli sullo stile delle Scelte di Immagine? Dai un'occhiata al nostro articolo su Come personalizzare le etichette per le Scelte di Immagine.