Contact Form 7, Colocar campos lado a lado.

>

2 horas atrás, Agatacat disse:

Estou usando o Contact Form 7 e o plugin CF7 SKINS,  preciso deixar alguns campo lado a lado:

 <label> Cidade

 [text* text-317] </label>

 <label> Estado

 [text* text-317] </label>

 <label> Código Postal

 [text* text-317] </label>

 <label> Telefone para Contato

 [tel* tel-459] </label>

 <label> Seu e-mail

 [email* your-email] </label>

 Assim que está atualmente, e os campos ficam um embaixo do outro, gostaria de deixar os campos Cidade e Estado um do lado do outro, alguém saberia como fazer isso?

 E também gostaria de saber como posso limitar as caixas de texto, como podem ver na imagem ela vai até a lateral máxima da página.

 Agradeço desde já pela ajuda.

 ![imagem](https://forum.imasters.com.br/monthly_2019_10/111.PNG.c744143c6d35d60c2d45b8a09de6a553.PNG)

	Boa noite eu acredito que assim vai te ajudar...

	 

<div class="col-md-6">
	<div class="form-group">
<label>Cidade:</label>
	<input class="form-control" name="cidade" required>
</div>
	</div>

<div class="col-md-6">
	<div class="form-group">
<label>Estado:</label>
	<input class="form-control" name="estado" required>
</div>
	</div>

<div class="col-md-12">
	<div class="form-group">
<label>Código Posta:</label>
	<input class="form-control" name="codigo_postal" required>
</div>
	</div>

<div class="col-md-12">
	<div class="form-group">
<label>Telefone para Contato:</label>
	<input class="form-control" name="telefone" required>
</div>
	</div>

<div class="col-md-12">
	<div class="form-group">
<label>Seu e-mail:</label>
	<input class="form-control" type="email" name="email" required>
</div>
	</div>

<div class="col-md-12">
	<div class="form-group">
<label>Descrição:</label>
	<textarea rows="6" class="form-control" name="descricao" required></textarea>
</div>
	</div>

	Define o tamanho class="col-md-6" se o input ficar grande com o 12 coloca 8

>

3 horas atrás, Agatacat disse:

Estou usando o Contact Form 7 e o plugin CF7 SKINS,  preciso deixar alguns campo lado a lado:

 <label> Cidade

 [text* text-317] </label>

 <label> Estado

 [text* text-317] </label>

 <label> Código Postal

 [text* text-317] </label>

 <label> Telefone para Contato

 [tel* tel-459] </label>

 <label> Seu e-mail

 [email* your-email] </label>

 Assim que está atualmente, e os campos ficam um embaixo do outro, gostaria de deixar os campos Cidade e Estado um do lado do outro, alguém saberia como fazer isso?

 E também gostaria de saber como posso limitar as caixas de texto, como podem ver na imagem ela vai até a lateral máxima da página.

 Agradeço desde já pela ajuda.

 ![imagem](https://forum.imasters.com.br/monthly_2019_10/111.PNG.c744143c6d35d60c2d45b8a09de6a553.PNG)

	 

	Ola me desculpe eu não tinha vista que era no wordpress

	mais pode fazer mais o menos isso aqui

	 

<div class="clearfix">
 <div id="left">
 Nome [text* your-name] <br/>
 E-mail [text your-subject]
 </div>
 <div id="right">
 Assunto [email* your-email] <br/>
 Telefone [tel tel-207]
 </div>
</div>

Mensagem [textarea your-message] <br/>

[submit "Enviar"]

no CSS

faz assim

/--- form 2 colunas ---/

#left {
width: 49%;
float: left;
margin-right:2%;
}

#right {
width: 49%;
float: left;
}

.clearfix:after {

content:"\0020";
display:block;
height:0;
clear:both;
visibility:hidden;
overflow:hidden;
margin-bottom:30px;
}

.clearfix {
display:block;
}

Resultado sera isso

/applications/core/interface/imageproxy/imageproxy.php?img=https://www.liguecerto.com/img/contact-form-7-two-columns.jpg&key=f4e056e49c37aa108ce48aff69f0c87ba33081e6250bf62f2a25410c3d493ef4" width="805" data-imageproxy-source="https://www.liguecerto.com/img/contact-form-7-two-columns.jpg" />

Qualquer coisa se tiver duvida ainda veja mais no link a baixo....

Outro ex: aqui...

Boa sorte