Ir ao conteúdo
  • Cadastre-se

Cor da section não aparece em todo o fundo


Posts recomendados

Estou criando um site e no body usei um background de umas chaves amarelas, mas nas sections chamadas conteudo eu uso uma cor.

Em todas ficou ok, mas na de contato ao invés da cor amaralo claro que seria todo o fundo da section, em alguns pequenos pedaços esta aparecendo as chaves do body.

Observem do lado esquerdo onde tem nome assunto mensagem...

Do lado direito dos campos do formulario coloquei o mapa do google maps (por privacidade coloquei uma imagem branca para não aparecer o endereço.

Posto o html e css dos itens que eu acho que vão esclarecer vocês.

html

body {
	margin:0px;
	padding:0px;
	background-image:url(../imagens/background2.jpg);
	background-repeat:repeat;
	
}

<section id="conteudocontato"><!--Inicio da div conteudo que receberá o conteúdo central da tela--> 



<h1>CONTATO</h1>

<form id="formcontato" method="post" action="envia.php">

	<label for="assunto">Assunto:</label>
	<select id="assunto" name="assunto">
		<option value="orcamento">Orçamento</option>
		<option value="comentario">Comentário</option>
		<option value="critica">Crítica</option>
		<option value="elogio">Elogio</option>
		<option value="trabalheconosco">Trabalhe Conosco</option>
	</select>

	<p>
	<label for="nome">Nome:</label>
	<input type="text" name="nome" id="nome"/>
	</p>

	<p>
	<label for="e-mail">E-mail:</label>
	<input type="text" name="e-mail" id="e-mail"/>
	</p>

	<p>
	<label for="mensagem">Mensagem:</label>
	<textarea name="mensagem" id="mensagem" wrap="physical"></textarea>
	</p>

	<p>
	<input type="submit" name="enviar" id="enviar" value="Enviar"/>
	<input type="reset" name="limpar" id="limpar" value="Limpar"/>

	</p>
      
</form>

</section><!--Fim da div conteudo que receberá o conteúdo central da tela--> 
section#conteudocontato {
	clear:both;
	padding-top:1%;
	padding-bottom:1%;
	background-color:#FFC;
	font-size:16px;
	font-family:Verdana, Geneva, sans-serif;
	margin:auto;
	width:96%;
	padding-left:2%;
	padding-right:2%;
	position:relative;
	max-width:960px;
		
}

#formcontato{
	background-color:#FFC;
	float:left;
	position:relative;

}

 

Link para o comentário
Compartilhar em outros sites

Nesses casos tente postar um link para um desses sites de prévia de códgio online. Fica muito mais fácil para vermos o que está acontecendo e também sugerir soluções. (:
 

Se você der um inspect no #conteudocontato verá que ele não está esticando para compreender os children dele. Nesses casos um overflow:auto salva. Quando por algum motivo o auto criar barras de rolagem onde não deve use hidden.

 

Preview: https://jsfiddle.net/qftph17x/

  • Curtir 1
Link para o comentário
Compartilhar em outros sites

Visitante
Este tópico está impedido de receber novas respostas.

Sobre o Clube do Hardware

No ar desde 1996, o Clube do Hardware é uma das maiores, mais antigas e mais respeitadas comunidades sobre tecnologia do Brasil. Leia mais

Direitos autorais

Não permitimos a cópia ou reprodução do conteúdo do nosso site, fórum, newsletters e redes sociais, mesmo citando-se a fonte. Leia mais

×
×
  • Criar novo...