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

css duvida em firefox

Discussão em 'Web Development' iniciada por Me and you, 29 de Maio de 2007. (Respostas: 19; Visualizações: 951)

  1. Me and you

    Me and you Power Member

    alguem me pode explicar pk e que a propriedade width n funciona no firefox? acho isto muito esquisito.
    exemplo:
    a {width: 200px;background-color: #f00;padding: 4px;}
    só me faz o padding, n poem o tamanho que lhe digo >(
    se me poderem ajudar agradecia muito
     
  2. ruimoura

    ruimoura Power Member

    Como é que raio queres definir o atributo width para um link? Isso não existe, dude ...
     
  3. Me and you

    Me and you Power Member

    tipo e o tamanho da caixa do link.
    no ie dá
     
  4. ruimoura

    ruimoura Power Member

    Mas qual caixa do link? Esse atributo não existe.
     
  5. HecKel

    HecKel The WORM

    Explica-te melhor. O que estás aqui a descrever não existe, tal como o ruimoura já referiu. Se calhar estás a explicar-te mal, ou então o que queres não existe mesmo.

    abraços, HecKel
     
  6. majo-san

    majo-san Power Member

    Testei esse código agora mesmo só para tirar a teima e no IE não dá. Revê lá as condições em que testaste o código porque realmente não funciona.
     
  7. shello

    shello Moderador
    Staff Member

    Não sei se é o que realmente queres fazer, mas adiciona lá a essas propriedades: display:block; a ver se faz o que queres... :\
     
  8. artideias

    artideias Power Member

    o problema é este mesmo, o link <a> é um elemento inline, ou seja é tratatdo como fosse texto, então width, height e outras propriedades não se aplicam ao mesmo.

    Ao definires o <a> como display: block; indicas que ele não é simplesmente texto mas é um um bloco e neste sim, podes colocar width e height e muito mais e sabes que ele vai ter quebras de linhas antes e depois e que supostamente deverá ocupar a totalidade da linha onde se encontra.

    http://www.w3.org/TR/REC-CSS2/box.html
     
  9. Me and you

    Me and you Power Member

    pois e isso porque eu depois pus float left; e já deu o que queria.
    se tiver vários "a"s em gfloat left já dá no firefox
     
  10. Me and you

    Me and you Power Member

    no ie7 do meu pc dá. esquisito.
     
  11. Me and you

    Me and you Power Member

    fogo o não me dou mesmo bem com o firefox. olhem me este código
    <html>
    <head>
    <style type="text/css">
    ul {list-style-type: none;}
    li {display: block;padding: 0px;margin: 0px;}
    a
    {
    background-color: #c0c0c0;width: 130px;margin: 0px;display: block;padding: 4px 0px 4px 10px;border-bottom: 2px solid #000;font-style: italic;
    font-family: times;font-size: 16px;text-decoration: none;border-left: 6px solid #808080;color: blue;
    }
    }
    a:hover {border-left: 6px solid blue;text-decoration: underline;}
    </style>
    </head>
    <body>
    <ul>
    <li><a href="#">Omg</a></li>
    <li><a href="#">Omg</a></li>
    </ul>
    </body>
    </html>

    funciona perfeitamente no ie mas no firefox não aparece o que kero em hover>(
    ou tenho o firefox mal instalado ou sou mesmo noob em css
     
  12. ruimoura

    ruimoura Power Member

    Dude, isso é mais incorrecto que eu sei lá. Estás a definir condições inválidas em quase tudo.

    E esse código não funciona porque tens um } a mais, antes do a:hover.

    Código que me parece fazer o que queres, mais ou menos:
     
  13. Me and you

    Me and you Power Member

    obrigado pela resposta ruimoura. pelo que percebi só posso então definir os "widths" nos "li"s.
    já agr como posso saber que propriedades de css tem cada element? existe algum site?
     
  14. ruimoura

    ruimoura Power Member

    Instala a extensão web developer para o firefox.
     
  15. Me and you

    Me and you Power Member

    ok obrigado.
     
  16. shello

    shello Moderador
    Staff Member

    A FireBug também é muito útil, consegues editar live com ajuda ;)
     
  17. Me and you

    Me and you Power Member

    tem bom aspecto o programa. obrigado shello
     
  18. artideias

    artideias Power Member

    podes ver em:
    http://www.w3schools.com/css/css_reference.asp

    Mas é melhores veres um http://www.maujor.com pois existem elementos que só em certas situações seram aplicados.

    no caso do <a> como elemento inline(texto) o width não se aplica mas se o decalres como block então já podes aplicar o width.

    Não existe nada melhor do que experimentar como estás a fazer. continua
     
  19. maningreen

    maningreen Power Member

    Não se percebi a dúvida mas...

    eis algumas coisas que gostava que me tivessem dito qd comecei:

    - faz tudo certinho para o firefox, depois afina para o IE (por mais que te custe...)
    - evita a propriedade inline sempre que possível, os browsers não aceitam mto bem (ainda) e dá as voltas q for preciso para isso.
    - atribui id´s sempre q possível:
    <li id="omg1">OMG1</li> no html
    #omg1 {width:200px; float: left;} para css´s caso seja um menu horizontal.
    Se for vertical, poe o ul dentro de uma div com 200px de width.
    A parte do display:block é incontornável para o efeito hover.
    - também é boa política por css´s num file à parte (identificas melhor os problemas)
    - o Dreamweaver 9 (ou CS3) faz a validação de css´s. Identifica pelo menos os erros depois é preciso puxar pela cartola pra resolver.

    Se queres mesmo dominar css´s e tens alguma pachorra (como eu), recomendo um livro que tira essas dúvidas todas num instante:
    http://www.friendsofed.com/book.html?isbn=1590596145

    Ou então, se não fores orgulhoso ou estiveres desesperado, saca o código daqui e não penses mais nisso...
    http://www.dynamicdrive.com/style/csslibrary/category/C1/

    Cheers.
     
  20. artideias

    artideias Power Member

    Tas engando, o display inline é bem aceite. Só que existem limitações para os atrubutos com esta caracteristica.

    um link <a>, <strong>, <span>, <em> todos estes elementos são inline, são texto e são apresentados como texto seguindo o elemento anterior, seguindo o fluxo de renderização do HTML que geralmente é da esquerda pra a direita e de cima para baixo.

    Agora em elementos inline, o width não funciona o height não funciona, os paddign e margin só funcionam para os lados (left, right)

    Mantem o código limpo e usa somente ID e CLASS se for mesmo preciso.

    Se usares um titulo que se repete 5 vezes nas mesma página e 100 em todo o site convem usar CLASS e tens a vantagem de ao mudar esta class mudas em todo o site os elementos que pertecem a essa CLASS. Caso uma delas tenha uma particularidade então secalhar usas a mesma CLASS mas também lhe dás um ID, mas sabes que todas caracteirsticas que definires na CLASS vão ter efeito nesse tuitulo e com o ID podes definir mais caracteirsticas ou mesmo anular algumas definidas pela CLASS.

    Penso que é uma questao de logica, e quantas mais CLASS usares provavelmente mais fácil sera gerir a apresentação do layout.

    Imagina que atribuis a cada titulo anterior um ID cada página tinha 5 diferentes terias que os definir e mesmo que fossem só esses para o site todo já muito mais.

    Queres dizer que o hover só funciona com o display : block !!?
    Tas enganado o hover funciona com inline e block e provavelmentes em outros "display" não suportado pela grande maioria dos browsers.

    O ie é que só suporta essa a pseudo class "hover" para os links <a> seja estes inline (que são por default) ou blocks.
    Mas FF, Opera e outros browsers suportam o hover nos <li>,<p>,<ol> em quase todos os outros elementos
     
    Última edição: 4 de Junho de 2007

Partilhar esta Página