Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Victor Maximo

Problemas com rodapé

Por , em Desenvolvimento frontend

Recommended Posts

Victor Maximo    0

Victor Maximo
Postado

Boa tarde pessoal,

bom estou desenvolvendo um site e estava indo tudo dentro do esperado visto que não sou experiente com desenvolvimento, mas aí me deparei com um problema, a DIV conteúdo não respeita o rodapé, e o rodapé não está ficando fixo la no fim da página.

Imagem relatada do problema:

25fm8b8.png

 

 

 

 

Eu preciso resolver esse problema e já tentei de tudo, não consegui resolver, peço encarecidamente a ajuda de alguém que entenda melhor que eu. Vou postar abaixo os codes (html/css), não sou mto semântico ainda, então desculpem desde já.

 

 

HTML:

<!doctype html>

<html><head>
<meta charset="utf-8">
<link rel="stylesheet" href="css2/style.css" media="screen"/>
<title>FTB/Advogados</title>




</head>

<body> 

    

         <div id="main">

          <div id="bglogo">
           
           <div id="logo"> </div>	
          
          </div> <!-- fim div bglogo-->

          <div id="filete"></div>
          <div id="bgmenu">

         	<div id="painelmenu">

					<div id="menu">
						
						
							<li><a href="#" class="active">Home</a></li>
							<li><a href="#">Escritório</a></li>
							<li><a href="#">Áreas de Atuação</a></li>
							<li><a href="#">Equipe</a></li>
							<li><a href="#">Contato</a></li>

						</div> <!-- fim div menu-->

			</div> <!-- fim div painel-->
		  </div>      <!-- fim div bgmenu-->


		  

		   

               <!-- <input type="text" class="pesquisar"  x-webkit-speech="" placeholder="Pesquisar" />
                <input type="button" class="btn" value="OK" />
             -->

		  

		 <div id="titlehome"> Fernando Teixeira Barbosa  </div>


 
      <div id="bloco1"> </div> 
	



    </div>  <!-- fim div main -->



<div id="footer"> Project by <a href="#" class="nolink">V-Design</a></a> </div>

</body>
</html>

CSS:

@charset "utf-8";
/* CSS Document */

*{
	padding:0;
	margin:0;
}



html, body {
	height:100%;
	background-color: #FFF;

	
}

#main {
	height: 100%;
	position:relative;
	margin: 0 auto;

	
	
}


* html #main {
	height: 100%; 
	}



#bglogo {
	position: absolute;
	width: 100%;
	height: 465px;
	background:url(../images/bg1.fw.png);
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;






}

#logo {
		
		position:absolute;
	    width:236px;
		height:136px;
		background:url(../images/newlogo.fw.png) no-repeat ;
		margin-top:0px;
		;
		left:50%;
		z-index: 3;

		
		
}


#filete {
 
            position: absolute;
			margin-top: 0px;
			height: 20px;
			width: 100%;
			background-color: #007952;
			opacity: 0.8;
			

}

#bgmenu {
			position: absolute;
			margin-top: 20px;
			height: 70px;
			width: 100%;
			background-color: #FFF;
			z-index: 2;
			opacity: 0.8;


		}


#painelmenu {
   position:relative;
   width:800px;
   height:100%;
   left:50%;
   ;
   clear:both;
   

   
}


#menu { 
    
	list-style-type: none;
	margin:0px 0px;
	background-color: #FFF;
	width: 100%;
	float:left;






}

#menu li { 

	position: relative;
	float:left;
	height: 70px;
    line-height: 70px;
	display:inline;
	margin-left: 0px;


}

#menu li a {

 padding: 21px 15px 22px 15px;
 font-family: Segoe UI;
 font-size: 20px;
 color: #007952;
 text-decoration: none;
 -webkit-transition:all .7s ease;
	-moz-transition:all .7s ease;
	-ms-transition:all .7s ease;
	-o-transition:all .7s ease;
	transition:all .7s ease;
	



}

#menu li a:hover {
			background-color: #00B285;
			color: white;
			
			}

			#menu li a.active {

            color: #FFF;   
			background: #007952;
			
			
  

			
			
			
		}


		


		#titlehome {
			position: absolute;
			font-size: 35px;
			font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
			color:#FFF;
			margin-top: 400px;

			left: 50%;
			;
			text-align:justify;
			padding:20px;




		}


		#bloco1 {

			position:absolute;
			background:url(../images/bloco1.fw.png) no-repeat;
			width:431px;
		    height:383px; 
           left:50%;
           margin-left:50px;
           margin-top: 310px;


		}



#footer {
	
	
	font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
	font-size:13px;
	color:white;
	width:100%;
	text-align:center;
	
	height:60px;
	background-color: #555;
	
   
}

.nolink {
text-decoration:none;
color:white;	
}

Se alguém puder ajudar, agradeço. dicas e criticas bem vindas

Compartilhar este post

Link para o post
Compartilhar em outros sites

Victor Maximo    0

Victor Maximo
Postado

Obrigado, o problema já foi semi-solucionado, estou fazendo alguns ajustes aqui pra ver e logo venho com novidades, se deu certo ou errado, mas desde já muuuuito obrigado pela atenção.


Bom, o que o amigo Andre falou realmente ajudou meu problema e ele foi resolvido! Muito obrigado mesmo, fico feliz por ver pessoas a disposição de ajudar. Espero logo poder estar ajudando também.

Só queria tirar uma última dúvida se não for pedir de mais, por algum motivo a minha div 'bloco 1' faz criar essa barra de rolagem no fim da página. Como retira-la?
Imagem relatada:
2num36c.png

Compartilhar este post

Link para o post
Compartilhar em outros sites

Victor Maximo    0

Victor Maximo
Postado

Pior que não resolveu já havia tentado, não sei porque isso acontece.

o código do bloco é este:

#bloco1 {

			  
			background:url(../images/bloco1.fw.png) no-repeat;
			width:431px;
		    height:383px; 
           margin-right:50px;
           margin-top: 500px;
           float:right;
           clear: right;
           padding-bottom: 20px;

		}

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito