Pregunta sobre Contact Form 7 de Wordpress:

formulario de contacto 7 ancho

Un usuario pregunt贸 馃憞

Hola chicos, he estado luchando con esta pregunta por un tiempo y he probado diferentes respuestas.

Quiero que el formulario de contacto completo abarque todo el ancho de la p谩gina.

Intent茅 lo siguiente sin 茅xito.

.wpcf7 {ancho: 100%! importante}

y tambi茅n

.wpcf7-form {ancho: 100%! importante}

pero ninguno de los dos funcion贸.

por favor ayuda

Lanzador de hilos

(@ luke-mersh)

Hace 2 a帽os, 5 meses

entonces prob茅: div.wpcf7 {ancho: 100%! importante;} parec铆a resolver el problema, pero cuando utilic茅 la misma t茅cnica de nuevo, no tuvo el mismo efecto.

por favor ayuda.

(@buzztone)

Hace 2 a帽os, 5 meses

Mira Formulario de contacto de estilismo – hay un enlace a un art铆culo que escrib铆 en la parte inferior de esa p谩gina (sugerido por el autor del plugin CF7, aunque no puedo vincularlo directamente aqu铆), que cubre este tema en detalle.

Utilice Chrome Dev Tools para examinar el estilo CSS aplicado a su formulario y determinar qu茅 cambios necesita realizar.

Si puede incluir un enlace a su formulario, otros pueden usar Chrome Dev Tools para sugerir CSS adecuado.

Lanzador de hilos

(@ luke-mersh)

Hace 2 a帽os, 5 meses

Hola Neil. Us茅 mis herramientas de desarrollo, pero eso no parece marcar la diferencia, ya que intento intentarlo de nuevo hoy.

Lanzador de hilos

(@ luke-mersh)

Hace 2 a帽os, 5 meses

Las herramientas de desarrollo web tampoco cambian el ancho del formulario.

aqu铆 est谩 mi c贸digo:

div.wpcf7 {ancho: 100%! importante; }

.wpcf7 {fondo: #ccc; ancho: 100%; }

ninguno de los formularios tiene el ancho de p谩gina completo de esta SEC.

Lanzador de hilos

(@ luke-mersh)

Hace 2 a帽os, 5 meses

creo que lo har茅

cree una ‘carpeta’ adicional, ya que las cosas no cambian en el desarrollo web y CSS en el formulario.

Le铆 que todos los formularios tienen la clase wpcf7 y que todo el contenedor de formularios est谩 hecho de div con la clase wpcf7, pero si no se realizan cambios de ancho del 100%, y si hago cambios de p铆xeles, solo se aplica a la derecha del formulario, estoy tratando de que el contenedor se extienda por todo el ancho de la p谩gina.

Muchas gracias de antemano

Lanzador de hilos

(@ luke-mersh)

Hace 2 a帽os, 5 meses

Intent茅 cambiar la apariencia a trav茅s del desarrollador web, pero el ‘ancho’ especificado en% no parece hacer nada.

este es el c贸digo del formulario:


 <form method="post" action="#">
                        <div class="inquiry-form">
                <h3 class="inquiry-title">Enquire about this property</h3>
                <div role="form" class="wpcf7" id="wpcf7-f12490-p12399-o1" lang="en-GB" dir="ltr">
<div class="screen-reader-response"></div>
<form action="/property/detached-mediterranean-style-villa-in-cabo-roig/#wpcf7-f12490-p12399-o1" method="post" class="wpcf7-form" novalidate="novalidate">
<div style="display: none;">
<input type="hidden" name="_wpcf7" value="12490" />
<input type="hidden" name="_wpcf7_version" value="5.0.4" />
<input type="hidden" name="_wpcf7_locale" value="en_GB" />
<input type="hidden" name="_wpcf7_unit_tag" value="wpcf7-f12490-p12399-o1" />
<input type="hidden" name="_wpcf7_container_post" value="12399" />
</div>
<p><label> Your Name (required)<br />
    <span class="wpcf7-form-control-wrap your-name"><input type="text" name="your-name" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" aria-required="true" aria-invalid="false" /></span> </label></p>
<p><label> Your Email (required)<br />
    <span class="wpcf7-form-control-wrap your-email"><input type="email" name="your-email" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-email wpcf7-validates-as-required wpcf7-validates-as-email" aria-required="true" aria-invalid="false" /></span> </label></p>
<p><label> Subject<br />
    <span class="wpcf7-form-control-wrap your-subject"><input type="text" name="your-subject" value="" size="40" class="wpcf7-form-control wpcf7-text" aria-invalid="false" /></span> </label></p>
<p><label> Your Message<br />
    <span class="wpcf7-form-control-wrap your-message"><textarea name="your-message" cols="40" rows="10" class="wpcf7-form-control wpcf7-textarea" aria-invalid="false"></textarea></span> </label></p>
<p><input type="submit" value="Send" class="wpcf7-form-control wpcf7-submit" /></p>
<input type='hidden' class='wpcf7-pum' value='{"closepopup":false,"closedelay":0,"openpopup":false,"openpopup_id":0}' /><div class="wpcf7-response-output wpcf7-display-none"></div></form></div>            </div>
        </form>

No puedo averiguar c贸mo hacer que se ampl铆e por completo. Apliqu茅 un color de fondo para ver la salida y la div.wpcf7 Trabaj茅 una vez, pero despu茅s de eso, el c贸digo en s铆 no se restaur贸 y ahora estoy perdido.

por favor ayuda. Muchas gracias de antemano

(@buzztone)

Hace 2 a帽os, 5 meses

Si puede incluir un enlace a su formulario, puedo usar Chrome Dev Tools para sugerir CSS adecuado; de lo contrario, no veo qu茅 est谩 sucediendo con el estilo de su formulario.

(@buzztone)

Hace 2 a帽os, 5 meses

El problema se volvi贸 a publicar con el enlace del formulario en https://wordpress.org/support/topic/issues-with-cf7/

(@buzztone)

Hace 2 a帽os, 5 meses

Chrome Dev Tools muestra el siguiente CSS aplicado a su formulario CF7:

div.wpcf7 {
    background-color: #ccc;
    width: 100% !important;
    border: 5px solid;
}

div.wpcf7 {
    margin: 0;
    padding: 0;
}

Esto parece funcionar como se esperaba, pero no ve el color de fondo porque el relleno est谩 configurado en cero.

Los cambios que propone parecen ser muy f谩ciles de implementar, siempre que tenga un conocimiento b谩sico de c贸mo usarlos. Herramientas de desarrollo de Chrome.

Lanzador de hilos

(@ luke-mersh)

Hace 2 a帽os, 4 meses

[Solved]

Gracias por toda tu ayuda.

驴Solucion贸 tu problema??

0 / 0

Deja una respuesta 0

Tu direcci贸n de correo electr贸nico no ser谩 publicada.