1. Este site usa cookies. Ao continuar a usar este site está a concordar com o nosso uso de cookies. Saber Mais.

Duvida css

Discussão em 'Programação' iniciada por PF_PLAYER, 27 de Fevereiro de 2008. (Respostas: 10; Visualizações: 890)

  1. PF_PLAYER

    PF_PLAYER Power Member

    #1 27 de Fevereiro de 2008
    Bom tarde, estou a fazer um menu de um site, o código dele é o seguinte:

    html - menu organizado assim:
    ------
    ...
    <body>
    <div id="menu">
    <b>
    <ul>
    <li><a href="fich/menu1.html" target="menu">menu1</a></li>
    <li><a href="fich/menu2.html" target="menu">menu2</a></li>
    <li><a href="fich/menu3.html" target="menu">menu3</a></li>
    <li><a href="fich/menu4.html" target="menu">menu4</a></li>
    <li><a href="fich/menu5.html" target="menu">menu5</a></li>
    <li><a href="fich/menu6.html" target="menu">menu6</a></li>
    <li><a href="fich/menu7.html" target="menu">menu7</a></li>
    <li><a href="#" onClick="changetwo('fich/ini.html', 'fich/menu8.html')">menu8</a></li>
    <li><a href="fich/menu9.html" target="menu">menu9</a></li>

    </ul>
    </b>
    </div>
    </body>

    ...

    ------

    css
    ------
    body { margin-left: auto;
    margin-right: auto;
    background-color: #FFFFFF;
    }
    #menu ul {
    margin: 1pt;
    padding:1pt;
    list-style-type: none;
    text-indent: 2px;
    margin-bottom:0pt;
    width: 135px;
    }
    #menu li { list-style: none;
    font-size:10pt;
    }
    #menu li a { display:block;
    color:#3267BF;
    text-decoration: none;
    }
    #menu li a:hover {color: #679966; background: #F3F3F3;}
    ------


    O problema é que ao abrir com o firefox aparece o menu normal com pouco espaço entre os items, como eu quero, e se abrir com o IE já aparecem mais afastados.

    como resolvo?
     
    Última edição: 27 de Fevereiro de 2008
  2. PF_PLAYER

    PF_PLAYER Power Member

    #2 27 de Fevereiro de 2008
    ups.. acho que me enganei na secção.
     
  3. meiokilo

    meiokilo Power Member

    #3 27 de Fevereiro de 2008
    oi,

    altera a seguinte css do li para:

    #menu li {
    list-style: none;
    font-size:10pt;
    height:18px;
    !height:8px;
    }

    O que fiz foi especificar a height para o elemento. A segunda height é apenas para o IE (tem o ! no inicio), caso contrário nao ficava bem.

    Espero ter ajudado
     
  4. PF_PLAYER

    PF_PLAYER Power Member

    #4 27 de Fevereiro de 2008
    olá, se eu colocar como você disse, a distancia entre os menus ficam um pouco maior do que eu queria, mas se eu tirar o height:18 e colocar por sua vez 16 já fica bem com a distância que quero no mozilla, mas assim tenho de definir um valor diferente para o height IE como faço?
     
  5. meiokilo

    meiokilo Power Member

    #5 27 de Fevereiro de 2008
    basta alterar !height:8px; para um valor que fique bem no IE. O resultado desta linha apenas se reflecte no IE
     
  6. PF_PLAYER

    PF_PLAYER Power Member

    #6 27 de Fevereiro de 2008
    Sim mas a distância mais pequena que dá no height do IE é 15, abaixo deste numero não diminui nada.
     
  7. meiokilo

    meiokilo Power Member

    #7 27 de Fevereiro de 2008
    Assim parece-me que dá:

    #menu li {
    list-style: none;
    font-size:10pt;
    margin-top:0px;
    !margin-top:-3px;
    }
     
  8. PF_PLAYER

    PF_PLAYER Power Member

    #8 27 de Fevereiro de 2008
  9. meiokilo

    meiokilo Power Member

    #9 27 de Fevereiro de 2008
    engraçado... no meu IE aparece bem... tenta diminuir o valor do margin para o IE
     
  10. PF_PLAYER

    PF_PLAYER Power Member

    #10 27 de Fevereiro de 2008
    Bom, muito obrigado pela ajuda, mexi lá nos valores e deu.

    http://xs124.xs.to/xs124/08093/ex2730.png


    #menu li {
    list-style: none;
    font-size:10pt;
    margin-top:0px;
    !margin-top:-8px;
    !margin-bottom:-18px;
    }


    mas agora o problema é que se colocar um valor menor que -7, no !margin-top:;, por exemplo -8 como se vê na imagem, as letras começam a ser cortadas, mas o essencial já está, a única diferença que vai existir entre os dois browsers são as letras que vão ficar mais acima no IE.
     
  11. SL87

    SL87 Power Member

    #11 27 de Fevereiro de 2008
    Vai ao google e procura:
    Internet Explorer CSS hacks.

    Infelizmente parece que os Eng. na microsoft têm algum problema com os CSS.
     

Partilhar esta Página