Avisos
Vaciar todo
Hola!
Tengo este formulario hecho con CSS, pero me gustaría que para dispositivos móviles se mostrase solo en una columna.
http://irlanda.quierogroup.webfactional.com/pedir-presupuesto/
Por favor, ¿me podríais decir que CSS ponerle que no estoy dando con la tecla?
Mil gracias por la ayuda!
URL del sitio: Contenido solo visible a usuarios registrados
Respondido : 06/02/2017 12:46 pm
Hola Julio.
No conseguí ver que archivo es el que maneja el código ya que parece que carga en cache pero bueno básicamente seria añadir lo siguiente:
@media (max-width: 600px) {
#right {
float:none;
}
}
Un saludo
Respondido : 06/02/2017 2:08 pm
Hola Pepe,
Lo puse pero no funciona tal como puedes comprobar...
El código del formulario es este:
/*--- 2 Column Form Styles Start ---*/
#left {
width: 47%;
float: left;
border: 2px solid #fff;
background-color: #fff;
padding-left: 3%;
padding: 20px;
}
#right {
width: 47%;
float: left;
/* margin-right: 6%; */
border: 2px solid #fff;
background-color: #cccccc;
padding-right: 3%;
padding: 20px;
}
.clearfix:after {
content:"020";
display:block;
height:0;
clear:both;
visibility:hidden;
overflow:hidden;
margin-bottom:10px;
}
.clearfix {
display:block;
}
A ver si lo conseguimos!
Gracias!
Respondido : 06/02/2017 2:16 pm
Hola de nuevo,
alguien pudo ver ésto por favor?
Gracias!
Respondido : 06/02/2017 4:48 pm
Hola
Prueba con el siguiente código al final de tu archivo style.css de tu theme
@media(max-width:678px){
.wpcf7-form #right,
.wpcf7-form #left{
width:100%;
}
}
Lo que hace el código es forzar el ancho a 100% cuando el ancho del dispositivo sea menor o igual a 678px
Saludos.
Respondido : 06/02/2017 9:44 pm
Muchas gracias, funciona perfectamente!
Respondido : 07/02/2017 9:44 am
