Cómo eliminar el espacio en blanco alrededor de las opciones de imagen

¿Desea eliminar el espacio adicional que rodea a sus imágenes al utilizar Opciones de imagen para los campos de formulario de Casilla de verificación o Opción múltiple? Con unas pocas líneas de CSS, puede lograrlo sin esfuerzo, ¡y estamos aquí para guiarle en el proceso!

Creación del formulario

Primero, comience creando su formulario en WPForms. Una vez que haya creado su formulario, agregue los campos que necesite, incluido el campo Opción múltiple que servirá como base para nuestra configuración de Opciones de imagen.

Si no está seguro de cómo configurar las Opciones de imagen, puede consultar nuestra documentación sobre cómo agregar Opciones de imagen a WPForms. Simplemente haga clic aquí para obtener instrucciones detalladas.

Eliminación del espacio en blanco

Si no está seguro de cómo o dónde agregar CSS a su sitio, puede consultar este tutorial para obtener orientación.

Para todos los formularios

Por defecto, cuando agrega Opciones de imagen a su formulario, aparece un espacio en blanco alrededor de la imagen debido al relleno CSS. Este espacio en blanco se puede ver en la siguiente imagen:

Para eliminar este espacio en blanco, deberá copiar y pegar el siguiente código CSS en su sitio:

span.wpforms-image-choices-label {
    display: none !important;
}

.wpforms-field-label-inline {
    line-height: 0 !important;
}

label.wpforms-field-label-inline {
    padding: 0 !important;
}

Este código CSS no solo eliminará el espacio en blanco alrededor de las imágenes, sino que también ocultará las etiquetas asociadas con cada imagen, permitiendo que las imágenes destaquen por sí solas.

Para un formulario específico

Para eliminar este espacio en blanco para el ID de formulario 1328, deberá copiar y pegar el siguiente código CSS en su sitio:

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;
}

¡Y eso es todo! Ha eliminado con éxito el espacio en blanco alrededor de las imágenes en su formulario. ¿Por qué no consulta más artículos sobre el estilo de las Opciones de imagen? Eche un vistazo a nuestro artículo sobre Cómo personalizar las etiquetas para las Opciones de imagen.