Ir para conteúdo
Fórum Script Brasil
  • 0

Menu Centralizado


drodrigo

Pergunta

Bom dia galera.

Pessoal eu estou com uma dificuldade que pra mim está dificil mais creio que para vocês deva ser simples.

Seguinte eu estou tentando colocar o menu centralizado na página, que funcione em qualquer resolução ele tando sempre centralizado na página, e essa e minha difucldade, colocar ele na tabela para centralizar sem ta dando erro como está comigo.

Estarei enviando o código do menu para vocês verificarem, e me ajudar como faço para colocar ele dentro da tabela, como faço para colocar as tags e mais. Ok.

Claro se puder me ajudar nessa dúvida...

Abraços galera.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="pt-br" xml:lang="pt-br">
<head>
<meta name="keywords" content="tutorial,acessibilidade,css,css menu,estilo,folhas estilo,layout css,layout sites,menu css,paginas web,tutorial css,web design,web standards,webdesign,tableless" />
<meta name="description" content=" Tutoriais, macetes, dicas sobre uso das CSS para projetar sites." />
<meta name="author" content="Nick Rigby" />
<meta name="MSSmartTagsPreventParsing" content="true" />
<meta http-equiv="imagetoolbar" content="no" />
<meta http-equiv="Pragma" content="no-cache" />
<meta name="robots" content="all" />
<meta name="language" content="pt-br" />
<meta name="ICBM" content="-22.975781,-43.193082" />
<meta name="DC.title" content="CSS para Web Design" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Horizontal Drop Down Menus - Parte 3</title>
<script type="text/javascript">
function IEHoverPseudo() {

    var navItems = document.getElementById("primary-nav").getElementsByTagName("li");
    
    for (var i=0; i<navItems.length; i++) {
        if(navItems[i].className == "menuparent") {
            navItems[i].onmouseover=function() { this.className += " over"; }
            navItems[i].onmouseout=function() { this.className = "menuparent"; }
        }
    }

}
window.onload = IEHoverPseudo;

</script>

<style type="text/css">

body { font: normal 62.5% verdana; }

ul#primary-nav,
ul#primary-nav ul {
    margin: 0;
    padding: 0;
/*    width: 600px; */ /* Width of Menu Items */
    border-bottom: 0px; solid #ccc;
    background: #fff;   /* IE6 Bug */
/*    background: blue;  /* IE6 Bug */ cor do fundo dos menus
    font-size: 100%;
    }


ul#primary-nav li {
    position: relative;
    list-style: none;
    display: inline;
        float:left;
    }

ul#primary-nav li a {
    display: block;
    text-decoration: none;
        float:left;
    color: #777;
/*    color: red;   cor das letras do menu */
    padding: 5px;
    border: 1px solid #ccc;
    border-bottom: 1;
    }

/* Fix IE. Hide from IE Mac \*/
* html ul#primary-nav li { float: left; height: 1%; }
* html ul#primary-nav li a { height: 1%; }
/* End */

ul#primary-nav ul {
    position: absolute;
    display: none;
    left: 0px;   /* Set 1px less than menu width */
    top: 23px;
    }

ul#primary-nav li ul li a { padding: 2px 5px; } /* Sub Menu Styles */

ul#primary-nav li:hover ul ul ,
ul#primary-nav li:hover ul ul ul,
ul#primary-nav li.over ul ul,
ul#primary-nav li.over ul ul ul { display: none; top: 17px;} /* Hide sub-menus initially */

ul#primary-nav li:hover ul,
ul#primary-nav li li:hover ul,
ul#primary-nav li li li:hover ul,
ul#primary-nav li.over ul,
ul#primary-nav li li.over ul,
ul#primary-nav li li li.over ul { display: block; } /* The magic */

ul#primary-nav li.menuparent { background: transparent url(arrow-down.gif) right center no-repeat; }
/* ul#primary-nav li.menuparent { background: yellow url(arrow-down.gif) right center no-repeat; } Cor dos que tem o -> */

ul#primary-nav li.menuparent:hover,
ul#primary-nav li.over { background-color: #f9f9f9; }
/*ul#primary-nav li.over { background-color: blue } cor da selecao quando tem submenu */

ul#primary-nav li a:hover { color: #E2144A;  }
/*ul#primary-nav li a:hover { color: blue; background-color: blue} cor da letra dos menus com selecao / cor do fundo */

</style>
</head>
<body>
<h1>EXEMPLO DE MENU PRINCIPAL NA HORIZONTAL</h1>
<h2>Adaptação feita por:</h2>Marcos Antunes Moleiro<br><br>
<ul id="primary-nav">
  <li><a href="#">Home</a></li>

  <li class="menuparent"><a href="#">About   </a>
    <ul>
      <li><a href="#">History</a></li>

      <li><a href="#">Team</a></li>
      <li><a href="#">Offices</a></li>
    </ul>
  </li>

  <li class="menuparent"><a href="#">Services   </a>
    <ul>
      <li><a href="#">Web Design</a></li>

      <li><a href="#">Internet Marketing</a></li>
      <li class="menuparent"><a href="#">Hosting   </a>
        <ul>
          <li><a href="#">Dedicated</a></li>

          <li><a href="#">Virtual</a></li>
          <li><a href="#">Shared</a></li>

          <li><a href="http://www.uem.br" target="_blank">Managed</a></li>
        </ul>
      </li>
      <li><a href="#">Domain Names</a></li>
      <li><a href="#">Broadband</a></li>

    </ul>
  </li>

  <li class="menuparent"><a href="#">Contact Us   </a>
    <ul>
      <li><a href="#">United Kingdom</a></li>
      <li><a href="#">France</a></li>
      <li><a href="#">USA</a></li>

      <li><a href="#">Australia</a></li>

    </ul>
  </li>
</ul>
</body>
</html>

Link para o comentário
Compartilhar em outros sites

1 resposta a esta questão

Posts Recomendados

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152k
    • Posts
      651,8k
×
×
  • Criar Novo...