Não use position absolute ou tamanho fixo

Usar Relative em tudo?
Em quais casos uso Relative e absolute?

Eu não uso absolute pra nada

Eu faço assim:
Relative para footer e conteúdo.
Fixed para header e utilitários.

Utilitários como ScrollUp, header fixo da tabela , dialog, etc

Fica assim, usei só relative em tudo:

image.jpg1409×408 180 KB

Então o código ta errado, posta ele

HTML

Carne Desossada

Cortes Nobres

Cortes Tradicionais

Carne Com Osso

Contra Filé

<a href="#"><div class="produto" id="galaxy">
                            <img src="img/cupim.png"/>
                            <h1>Cumpim A</h1>
                        </div></a>
						
						
						
                        <a href="#"><div class="produto" id="galaxy">
                            <img src="img/alcatra.jpg"/>
                        <h1>Alcatra</h1>
                        </div></a>
						
						
                        <a href="#"><div class="produto" id="galaxy">
                            <img src="img/patinho.jpg"/>
                         <h1>Patinho</h1>
                        </div></a></a>
						
						
                        <a href="#"><div class="produto" id="galaxy">
                            <img src="img/fraldinha.jpg"/>
                             <h1>Fraldinha</h1></a>
                             
                        </div>
						
						
                        <a href="#"><div class="produto" id="galaxy">
                            <img src="img/largato.png"/>
                             <h1>Largato</h1></a>
                           
                        </div>
						
						 <a href="#"><div class="produto" id="galaxy">
                            <img src="img/coxaomole.png"/>
                             <h1>Coxao Mole</h1></a>

                        </div>
						
						 <a href="#"><div class="produto" id="galaxy">
                            <img src="img/coxaoduro.jpg"/>
                             <h1>Coxao Duro</h1>
                        </div></a>
						
						 <a href="produtos/picanha.html"><div class="produto" id="galaxy">
                            <img src="img/picanha.png"/>
                             <h1>Picanha Grill</h1>  
                        </div></a>

                        </div>

Forte Boi Indústria de Alimentos LTDA
Todos os Direitos Reservados &copy

<script src="js/jquery.flexslider.js"></script>
<script type="text/javascript" charset="utf-8">

$(window).load(function() {

$(’.flexslider’).flexslider({

touch: true,

pauseOnAction: false,

pauseOnHover: false,

});

});

Nao estou conseguindo postar o código

.responsivecatalaogo{

max-width: 500x;

width: 100%;

height: auto;

}

#imgcatalogo{

position: absolute;

max-width: 100%;   /* Máximo da largura da imagem <em>/

width: 100%;

max-height: 90%;  /</em> Máximo da altura da imagem */

min-height: auto;

top: 260px;

}

}

/INICIO DO CATALOGO DE PRODUTOS/
#produtos{

border-radius: 8px;
width: 100%;
position:absolute;
top: 870px;

}

.produto{

width: 17%;

height: 235px;

margin-top: 25px;

border: 1.0px solid #ecf0f1;

border-radius: 8px;

float: left;

display: block;

margin-left: 85px;

}

.produto img{

margin: 15px;

position:relative;

left:10%;

max-width:200px;

max-height:150px;

width: auto;

height: auto;

}

.produto h1{

text-align:center;

font-size: 0.6em;

margin: 8px;

font-family:‘Arial’;

color: #2d3436;

margin-bottom: 5px;

}

.produto p{

text-align:left;

margin-left: 30%;

}

.produto h2{

text-align:center;

margin: 10px;

font-size: 17px;

}

/<em>FIM DO CATALOGO DE PRODUTOS</em>/

/<em>INICIO RODAPE DO CATALOGO DE PRODUTOS</em>/

#rodapecatalogo{

width: auto;

position: relative;

height: 60px;

top:2150px;

background: linear-gradient(to right,#05c46b,#27ae60 );

text-align: center;

font-size: 17px;

color:#fff;

font-family: ‘Calibri’;

padding: 2px;

padding-top: 40px;

}

/<em>FIM RODAPE DO CATALOGO DE PRODUTOS</em>/

#divisaocatalogo{

border: none;

width: 92%;

height: 5px;

background-color: #c0392b;

top: 750px;

position:absolute;

margin-left: 50px;

}

/<em>INICIO TITULO DESOSSADO DO CATALOGO DE PRODUTOS</em>/

#titulodessossado{

text-align:left;

font-size: 2em;

margin-left: 55px;

top: 710px;

font-family:‘Arial’;

color: #c0392b #e74c3c;

margin-bottom: 5px;

position:absolute;

}
/FIM TITULO DESOSSADO DO CATALOGO DE PRODUTOS/

/<em>SUBTITULO CORTES NOBRES DO CATALOGO DE PRODUTOS</em>/

#titulocortesnobres{

text-align:left;

font-size: 2.4em;

margin-left: 40%;

top:  740px;

font-family:‘Arial’;

color: #2d3436;

margin-bottom: 5px;

position:relative;

}
/FIM CORTES NOBRES DO CATALOGO DE PRODUTOS/

#galaxy:hover

{

-webkit-transform: scale(1.1);

-ms-transform: scale(1.1);

transform: scale(1.1);

}

#titulocortestradicionais{

text-align:left;

font-size: 2.4em;

margin-left: 40%;

top:  1600px;

font-family:‘Arial’;

color: #2d3436;

margin-bottom: 5px;

position:relative;

}

#titulocarnecomosso{

text-align:left;

font-size: 2em;

margin-left: 55px;

top: 1740px;

font-family:‘Arial’;

color: #c0392b #e74c3c;

margin-bottom: 5px;

position:relative;

}
#divisaocatalogocomosso{

border: none;
width: 92%;
height: 5px;
background-color: #c0392b;
top: 1800px;
position:relative;
margin-left: 50px;

}

Colocando pra relative dá tudo no mesmo…
Estava lendo, sempre tem que colocar absolute no pai e na filha sempre relative, procede isso?

Olha, o menu está como relativo, a foto do banner como absoluto e o restante abaixo como absoluto.

O contrário…

Tira os seus top e muda para position: relative

Se você esta com dúvida sobre position, cria uma página sem nada e vai adicionando div com position relative e cores diferentes, ai você verá que vai ficar uma embaixo da outra, colada uma na outra, ai é só da margin

seria apenas margin ou margin-top?

Sim, apenas.

posso utilizar no margin-top ou no margin um valor negativo? ex:

margin-top: -20px;?

Pode sim.
O contrário de afastar é aproximar, ai ao invés de se afastar do topo, irá se aproximar mais.

Cara, deu tudo certo, não sei nem como te agradecer, muito obrigado.

Se não for pedir muito, me ajuda só em mais um problema…
o rodape tá assim…

image.jpg1421×122 15.4 KB

o html…

Vish, parece que tem algum css sobrescrevendo ai.

Inspeciona o seu footer e me manda todo o css dele e do h4

EDIT: ou então pode ser cache de uma alteração anterior