Cambiar el tamaño de fuente de las etiquetas y los campos de entrada - Material Design for Contact Form 7 Wordpress en español

Un usuario preguntó 👇

Hola,

[I’ve bought the pro version of the plugin.]

Quiero poder cambiar el tamaño de fuente de las etiquetas y los campos de entrada, independientemente de la <html> tamaño de fuente.

Entiendo que el tamaño de fuente de estos elementos se basa en rem, pero cambiar el tamaño de fuente html no es una opción para mí. ¿Podría sugerir una forma alternativa, tal vez CSS personalizado para ayudar con esto?

Gracias.

(@ gusruss89)

Hace 2 años, 4 meses

Hola @ tanushree42

Para el formulario al que se vinculó, el siguiente CSS personalizado debería ser suficiente. Puede agregarlo a través de Apariencia> Personalizar> Formularios de diseño de contenido> CSS personalizado.

#cf7md-form .mdc-select .mdc-floating-label,
#cf7md-form .mdc-text-field .mdc-floating-label {
    font-size: 16px;
    line-height: 1.75;
}
#cf7md-form .mdc-text-field .mdc-floating-label {
    bottom: 12px;
}
#cf7md-form .mdc-text-field__input,
#cf7md-form .mdc-select__native-control {
    font-size: 16px;
    line-height: 1.75;
}
#cf7md-form .mdc-text-field--textarea .mdc-floating-label {
    padding-top: 8px;
    margin-top: 2px;
    padding-bottom: 2px;
}

Puede jugar con los valores de píxeles si lo desea. Sin embargo, probablemente debería mantener la altura de la línea en 1,75.

Gracias angus

Lanzador de hilos

(@ tanushree42)

Hace 2 años, 4 meses

Gracias. Esto es muy útil.

Hay una pregunta, si pudiera ayudar. Lo verá cuando comience a escribir en el campo de texto. La etiqueta no aparece completamente y la primera línea que escribimos en el campo de texto también está obsoleta.

Mira aquí: https://new.uncommon.is/contact/

(@ gusruss89)

Hace 2 años, 4 meses

Hola @ tanushree42,

Intenta cambiar esto

#cf7md-form .mdc-text-field .mdc-floating-label {
    bottom: 12px;
}

para este propósito

#cf7md-form .mdc-text-field:not(.mdc-text-field--textarea) .mdc-floating-label {
    bottom: 12px;
}

Avísame si no funciona 🙂

Gracias, Aonghas

Lanzador de hilos

(@ tanushree42)

Hace 2 años, 4 meses

¡Gracias @ gusruss89! Esto funciona muy bien.

¿Solucionó tu problema??

0 / 0