2 votes

Les images ne s'affichent pas dans IE 9

J'ai presque terminé la création de mon premier site web. Cependant, il ne semble pas fonctionner correctement dans IE. Il fonctionne bien dans Firefox et Chrome. L'arrière-plan se charge mais le problème principal est que les liens vers les images semblent cassés ? Toute aide serait grandement appréciée.

Mon site : ngkevin-art.com

CSS :

body {
    width:auto;
    height:auto;
    background-image:url(images/bg_main2.png);
    background-color:#2d2d2d;
    background-repeat:no-repeat;
    background-position:center;
    margin-top:30px;
}

#container {
    width:1280px;
    height:960px;
    margin-left:auto;
    margin-right:auto;

}

#wrapContact {

    width: 520px;
    height: 100px;
    margin-left:735px;
    margin-top: 10px;
    clear: both;
}

#linked {
    float:left; 
    margin-top:35px;
    width: 175px;   
}

#facebook {
    float:left;
    width: 200px;
    margin-left:32px;
    margin-top:25px;

}

#email {
    float:left;
    width:75px;
    margin-left:35px;
    margin-top:20px;

}

#wrapNav {

    width: 475px;
    margin-left:750px;
    margin-top:60px;
}

#wrapCharacters {

    width: 960px;
    z-index: 3;
    margin: 130px auto auto 75px;
    float:left;
}

.turntable {
    margin: .5% auto auto auto;

}

#zanza {

    float:left;
}

#titan {

    float:left;
    margin-left: 10px;
}

#rockBeast {

    float:left;
    margin-left: 10px;
}

HTML :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Kevin Ng Art Portfolio</title>
<script type="text/javascript"
src="http://code.jquery.com/jquery-latest.min.js" charset="utf-8">
</script>
<link rel="stylesheet" type="text/css" href="default3.css"/>
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.18.custom.min.js"></script>
<script type="text/javascript" src="js/jquery.smooth-scroll.min.js"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<link href="lightbox.css" rel="stylesheet" />

</head>

<body>

<div id="container">

        <div id="wrapContact">
            <div id="linked">
                <a href="http://www.linkedin.com/pub/kevin-ng/25/558/75b"> 
                <img src="images/logo_linked_large.png" width="auto" height="auto" border="0" alt="linkedin_logo" /> </a>
            </div>

            <div id="facebook">
                <a href="http://www.facebook.com/profile.php?id=1309131548"> 
                <img src="images/logo_fb_large.png" width="auto" height="auto" border="0" alt="facebook_logo" /> </a>
            </div>

            <div id="email">
                <a href="mailto: ngkevin.3dartist@gmail.com"> 
                <img src="images/gmail.png" width="auto" height="auto" border="0" alt="email_icon" /> </a>
            </div>
        </div> <!-- End "wrapContact"> -->

        <div id="wrapNav">

            <a href="index.html">                           
            <img src="images/bg_tab_main.png" width="auto" height="auto" border="0" alt="Main" /> </a>

            <a href="demo.html">                            
            <img src="images/bg_tab_demo.png" width="auto" height="auto" border="0" alt="Demo" /> </a>

            <a href="about.html">                           
            <img src="images/bg_tab_about.png" width="auto" height="auto" border="0" alt="About" /> </a>

        </div> 
        <!-- End "wrapNav"> -->  

        <div id="wrapAbout">

            <div id="picture">
                <img src="images/picture.jpg" width="auto" height="auto" alt="picture" />
                <div id="text2">
                    <h2> Me in the middle left, my buddies, Jordan Gabriel on the left and Edmund Zhu on the right,
                        and finally, Epic Games VIP, Cliff Bleszinski! Taken at GDC 2010. </h2>
                </div>
            </div>

            <div class="text">        
                <h1> Resume: <br/>
                <br/> Email: <br/> <br/>
                <br/> About Me:</h1>            
            </div>

            <div class="text3">
                <h1> <a href="resume/Kevin Ng Resume2.doc"> Click Here </a>
                <br/> <br/> <a href="ngkevin.3dartist@gmail.com"> ngkevin.3dartist@gmail.com </a> <br/> 
                <br/> <br/> <font size="4"> 
                    My desire to be in the game development industry is to work with other individuals that take pride in creating a game, 
                    something that can be enjoyed by a multitude of people. There is nothing I would like better than to lend my talents and 
                    artistic skills for that purpose. <br/> <br/>

                    I believe the key to creating memorable game art, whether it be characters or environments, is the story. 
                    Just like reading a good book or watching a thrilling movie, I loved to be immersed in the world of the game. As a result, 
                    I had an affinity to Role-Playing Games. Classic games of my generation such as Chrono Trigger, Final Fantasy, and Zelda 
                    showed me a world of endless imagination.  <br/> <br/>

                    The characters which are the focal point of the story, their goals and motivations, their trials and tribulations, 
                    their victories and defeats... These are the things I think about constantly when I look at them. 
                    A character without depth doesn't exist, but if they do, I can only imagine how boring that would be.                     
                </font></h1>
            </div>

        </div>

    </div><!-- End "container" -->

</body>
</html>

4voto

user315045 Points 1

Ce sont les attributs largeur/hauteur de vos images qui posent problème. La largeur et la hauteur sont réglées sur "auto". Soit vous définissez une largeur/hauteur explicite :

<img src="zanza/zanza_portrait_top.png" width="179" height="198" border="0" alt="zanza">

ou supprimer les attributs de largeur et de hauteur :

<img src="zanza/zanza_portrait_top.png" border="0" alt="zanza">

1voto

Alex Lynch Points 941

IE perturbe la largeur et la hauteur de l'image. Je suis désolé de ne pas pouvoir vous aider davantage, mais en supprimant les éléments de hauteur et de largeur de chaque image, les images s'affichent pour moi.

0voto

vellvisher Points 484

Voir ce lien sur le auto en CSS3. En fait, elle n'est pas prise en charge dans cette version et il est donc préférable de la définir explicitement ou de s'en passer.

Lien

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X