Suporte » Temas e templates » CSS – bt Home e Menu Dropdown

  • Resolvido privaldes

    (@privaldes)


    Boa tarde Srs,
    É a primeira vez que posto neste forum, apesar de já acompanhá-lo há algum tempo.

    Tenho um menu dropdown e gostaria de colocar uma imagem diferenciada para o menu Home. Não encontro o erro no CSS que está fazendo com que o HOME não fique centralizado junto com o menu existente. Como o site está sendo desenvolvido em WordPress, a chamada do menu está assim:

    <nav role=”navigation” class=”navwrap”>
    <ul class=”dropdown-home”>
    <li class=”home”>“>HOME

    <?php wp_nav_menu(array (
    ‘menu’ => ‘Menu Principal’,
    ‘theme_location’ => ‘menu-principal’,
    ‘container’ => ”,
    ‘items_wrap’ => ‘<ul id=”%1$s” class=”dropdown”>%3$s’
    )
    ); ?>
    </nav>

    E o CSS relacionado ao menu está assim:

    nav {
    float: left;
    width: 100%;
    font-size: 14px;
    font-weight: bold;
    background: #a90329; /* Old browsers */
    /* IE9 SVG, needs conditional override of ‘filter’ to ‘none’ */
    background: -moz-linear-gradient(top, #a90329 0%, #8f0222 44%, #6d0019 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a90329), color-stop(44%,#8f0222), color-stop(100%,#6d0019)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #a90329 0%,#8f0222 44%,#6d0019 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #a90329 0%,#8f0222 44%,#6d0019 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #a90329 0%,#8f0222 44%,#6d0019 100%); /* IE10+ */
    background: linear-gradient(to bottom, #a90329 0%,#8f0222 44%,#6d0019 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=’#a90329′, endColorstr=’#6d0019′,GradientType=0 ); /* IE6-8 */
    }

    .navwrap {
    text-align: center;
    }

    nav ul.dropdown {
    list-style: none;
    float: left;
    width: 80%;
    padding: 5px 10px 6px 0;
    }

    nav ul.dropdown li {
    display: inline;
    position: relative;
    z-index: 500;
    text-align: left;
    font-size: 14px;
    }

    nav ul.dropdown a {
    padding:12px;
    color: #eee;
    text-decoration: none;
    text-shadow: 0 1px 0 #000;
    }

    /* Estilo do link ao passar o mouse */

    nav ul.dropdown li:hover a {
    background: #444;
    }

    /* Exibir links em blocos */

    nav ul.dropdown li ul a {
    display: block;
    }

    /* Submenus */

    nav ul.dropdown ul {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 200px;
    position: absolute;
    z-index:500;
    }

    nav ul.dropdown li ul {
    top: 27px;
    }

    nav ul.dropdown ul ul {
    top: 0;
    left: 100%;
    }

    nav ul.dropdown ul li {
    float:none;
    }

    /* Dropdown */

    /* Esconder submenus */

    nav ul.dropdown ul, nav ul.dropdown li:hover ul ul, nav ul.dropdown ul li:hover ul ul {
    display: none;
    }

    /* Exibir submenus ao passar o mouse */

    nav ul.dropdown li:hover ul, nav ul.dropdown ul li:hover ul, nav ul.dropdown ul li ul li:hover ul {
    display: block;
    left: 0;
    top: 23px;
    }

    /* Mudar a cor do link do submenu ao passar o mouse */
    nav ul.dropdown li * a:hover {
    background: #666;
    background: -moz-linear-gradient( top, #200, #400); /* CSS 3 */
    border-bottom:1px solid #900;
    border-top:1px solid #222;
    }

    /* Menu home */
    nav ul.dropdown-home {
    float: left;
    width: 10%;
    }

    nav ul.dropdown-home li.home {
    }

    nav ul.dropdown-home li.home a {
    background: url(images/nav-home.png) no-repeat scroll center top transparent;
    color: #882424;
    height: 43px;
    width: 86px;
    padding: 5px 18px 20px 20px;
    }

    Alguém sabe me dizer onde estou errando?

A visualizar 4 respostas - de 1 a 4 (de um total de 4)
A visualizar 4 respostas - de 1 a 4 (de um total de 4)
  • O tópico ‘CSS – bt Home e Menu Dropdown’ está fechado a novas respostas.