Ir para conteúdo

POWERED BY:

Arquivado

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

MaCeRo

Problema com DIV'S

Recommended Posts

Estou elaborando um site através de DIV, e estou com uma dúvida que espero que alguém possa me ajudar.

 

Fiz as divs tudo direitinho, só que o menu eu kero que fike sobreposto ao topo, em um espaço em branco, eu até consegui colocar, mas arrastando, sei que não é o jeito certo, tanto é que se diminuir a tela do navegador o menu anda para o centro da página, keria saber como faço para fixa-lo aonde eu kero. Que no caso já está feito, mas não da maneira correta.

 

Vou colar o código abaixo e o link do site para que vocês possam entender.

 

HTML

<body onload="MM_preloadImages('images/botoes/reg_02.png','images/botoes/tab_02.gif','images/botoes/cart_02.gif','images/botoes/cont_02.png')">
<table width="749" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td valign="top"><div id="geral"><img src="images/topo.png" width="749" height="297" />
      <div id="topo">
        <div align="center" id="menu">
          <table width="200" border="0" cellpadding="0" cellspacing="0">
            <tr>
              <td width="20"><div align="center"><img src="images/circulo.png" width="12" height="12" /></div></td>
              <td height="35"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Regulamento','','images/botoes/reg_02.png',1)"><img src="images/botoes/reg_01.png" name="Regulamento" width="190" height="36" border="0" id="Regulamento" /></a></td>
            </tr>
            <tr>
              <td width="20"><div align="center"><img src="images/circulo.png" width="12" height="12" /></div></td>
              <td height="35"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Tabela','','images/botoes/tab_02.gif',1)"><img src="images/botoes/tab_01.gif" name="Tabela" width="190" height="34" border="0" id="Tabela" /></a></td>
            </tr>
            <tr>
              <td width="20"><div align="center"><img src="images/circulo.png" width="12" height="12" /></div></td>
              <td height="35"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Cartões','','images/botoes/cart_02.gif',1)"><img src="images/botoes/cart_01.gif" name="Cartões" width="190" height="37" border="0" id="Cartões" /></a></td>
            </tr>
            <tr>
              <td width="20"><div align="center"><img src="images/circulo.png" width="12" height="12" /></div></td>
              <td height="35"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Contato','','images/botoes/cont_02.png',1)"><img src="images/botoes/cont_01.png" name="Contato" width="190" height="36" border="0" id="Contato" /></a></td>
            </tr>
          </table>
        </div>
        <div id="data">
          <table width="749" border="0" cellpadding="1" cellspacing="4">
            <tr>
              <td width="600"><div align="right" class="style1">Americana, 19 de Agosto de 2009</div></td>
            </tr>
          </table>
        </div>
        <div id="conteudo">
          <table width="749" border="0" cellpadding="0" cellspacing="0">
            <tr>
              <td><div align="right" class="style1">
                  <p align="left"><img src="images/destaque.gif" width="438" height="233" /></p>
              </div>
                  <div align="center" class="style1"></div></td>
              <td width="320"> </td>
            </tr>
          </table>
          <p> </p>
        </div>
        <div id="rodape">
          <h3>Rodapé</h3>
        </div>
    </div></td>
  </tr>
</table>
</body>

CSS

 

@charset "utf-8";

* { margin: 0; padding: 0; } 
#conteudo, #menu, #rodape, #topo { font: 9pt Verdana, Tahoma, Arial; } 

#geral {
width: 749px;
}
#topo {
width: 749px;
height: 297px; 
}
#menu {
	width: 200px; 
	z-index: 1;
	position: relative;
	visibility: visible;
	display: block;
}

#menu {
	position: absolute;
	top: 139px;
	left: 120px;
	width: 200px;
	height: 145px;
	display: block;
}

#data {
	width: 749px; 
}
#conteudo {
width: 749px;
background-color: #FFFFFF; 
}
#rodape {
background-color: #1C8000; 
height: 40px; 
clear: both; 

Endereço do site: Clique aqui

 

Espero que alguém possa me ajudar.

 

Vlw.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Não entendi.

Você quer que o menu

Regulamento

Tabela

Cartçoes

Contato

que esta do lado esquerdo, fique no topo em cima de Copa Imperador 09. É isso ?

 

se for isso você, quer que ele fique em linha ?

Regulamento Tabela Cartçoes Contato

 

Explica melhor se não for!

 

T+

Compartilhar este post


Link para o post
Compartilhar em outros sites

Não 11closed.

 

Eu quero o menu no msm lugar que ele está. Mas eis o problema eu naum coloquei a div posicionada ali por comandos, eu criei uma div, defini o nome dela e arrastei aonde eu keria q ela ficasse pois não consegui através do código posicioná-la da maneira correta.

 

E outra...não sei se eu posso fazer isso da maneira q fiz (forçado) ou se é a maneira correta.

 

Pq não entendo mto bem ainda de DIV.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Olá maCeRo,

Observei no CSS do menu, isso: position: absolute;

Esse "comando", faz com que o seu menu "ande" conforme a resolução...

 

O melhor mesmo seria fazer o posicionamento via margin, padding e float. Pesquisando estas 3 propriedades, creio que você obterá o efeito desejado!

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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