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

HTML/CSS- imagens com link não funcionam online no IE

Discussão em 'Web Development' iniciada por brunor8, 19 de Dezembro de 2012. (Respostas: 11; Visualizações: 1749)

  1. Boa tarde,
    Este é o meu primeiro tópico por isso peço desculpa se estou a proceder mal com alguma situação.
    Estou a desenvolver um Website com o Dreamweaver CS5 e quando o coloco online acontecem algumas coisas estranhas no Internet Explorer.
    Em todos os browsers funciona bem online e offline. Quando faço visualização local com o IE, aparece tudo bem, mas quando coloco online as imagens ficam sem os links. Gostaria de saber se existe algum tipo de código específico para alterar esta situação.

    Obrigado
     
  2. Macarroni

    Macarroni Banido

    Estás a mandar as imagens para o servidor?
     
  3. Sim, aliás, as imagens aparecem todas e funcionam bem nos browsers, apenas não funcionam os seus links no Internet Explorer...
     
  4. esaramago123

    esaramago123 Power Member

    Podes mostrar o link ou o código? Sem descobrir a causa ninguém te pode ajudar.
     
  5. Esta é a página de teste, vejam no IE.

    http://www.edge-arts.org/teste/agenda.html

    Vejam os ícones no rodapé. No IE não funcionam e nos outros browsers funcionam bem.
    Isto depois acontece com outras imagens no resto do site.

    Agradeço a ajuda
     
  6. Macarroni

    Macarroni Banido

    Já vi que o hover não está a ser lido no IE.
    Podes passar esse bocado do código?
     
  7. Sim o hover e o link não funcionam no IE...
    Mais uma vez agradeço a vossa disponibilidade e ajuda :)


    HTML:

    Código:
    <div id="footer">
    
        <ul class="footer_icons">
    
    
            <li class="facebook_logo">
                <a href="http://www.facebook.com/edgearts.org?fref=ts" title="Facebook" target="_blank"></a>
            </li>
            <li class="mail_logo">
                <a href="mailto:[email protected]" title="E-mail" target="_blank"></a>
            </li>
            <li class="youtube_logo">
                <a href="" title="YouTube" target="_blank"></a>
            </li>
    
    
        </ul> <!--  end footer_icons -->
    
    
    <div id="bottom"></div>
    
    
    <div><p>ALL RIGHTS RESERVED | EDGE-ARTS 2012</p></div>
    
    </div><!--  end footer -->
    
    
    CSS:

    Código:
    #footer_container{    background:#D2D2D2;
        margin-top:15px;
        height:auto;
        width:100%;
    }
    
    
    
    
    #footer{
        bottom:0;
        background:#D2D2D2;
        margin:0 auto;
        text-align:center;
        font-family: "Univers-condensed-webfont", Arial, Helvetica, sans-serif;
        font-size: 15px;
        color:#777;
    }
    
    
    
    
    .footer_icons{
        width:220px;
        height:70px;
        margin:0 auto;
    }
    
    
    .facebook_logo{
        width:50px;
        height:50px;
        float:left;
        padding: 10px 10px;
    }
    
    
    .facebook_logo a{
        width:50px;
        height:50px;
        background-image:url(../images/facebook_edge-arts.png);
        float:left;
        background-position:top;
        background-repeat:no-repeat;
    }
    
    
    .facebook_logo a:hover{
        width:50px;
        height:50px;
        background-image:url(../images/facebook_edge-arts.png);
        float:left;
        background-position:bottom;
        background-repeat:no-repeat;
    }
    
    
    .mail_logo{
        width:50px;
        height:50px;
        float:left;
        padding: 10px 10px;
    }
    
    
    .mail_logo a{
        width:50px;
        height:50px;
        background-image:url(../images/mail_edge-arts.png);
        float:left;
        background-position:top;
        background-repeat:no-repeat;
    }
    
    
    .mail_logo a:hover{
        width:50px;
        height:50px;
        background-image:url(../images/mail_edge-arts.png);
        float:left;
        background-position:bottom;
        background-repeat:no-repeat;
    }
    
    
    .youtube_logo{
        width:50px;
        height:50px;
        float:left;
        padding: 10px 10px;
    }
    
    
    .youtube_logo a{
        width:50px;
        height:50px;
        background-image:url(../images/youtube_edge-arts.png);
        float:left;
        background-position:top;
        background-repeat:no-repeat;
    }
    
    
    .youtube_logo a:hover{
        width:50px;
        height:50px;
        background-image:url(../images/youtube_edge-arts.png);
        float:left;
        background-position:bottom;
        background-repeat:no-repeat;
    
    
    }
    
    
    
     
  8. Macarroni

    Macarroni Banido

    E se removeres os floats?
     
  9. Desaparecem as imagens...
     
  10. Macarroni

    Macarroni Banido

    Sinceramente não estou a ver o que se possa passar.
     
  11. Obrigado na mesma :)
    Vou tentar construir o código de outra forma...
     
  12. Boas,
    Consegui detectar o erro :001:

    O body estava a sobrepor-se no ie!
    Retirei o código na CSS ( position e z-index) do body...

    Obrigado pela ajuda a todos.

    Cumps
     

Partilhar esta Página