rss
Ils ont besoin de votre aide Tous les messages sans réponse
Rechercher : dans
Par : Pertinence Date Nom d'utilisateur
Statut : Non résolu

Problèm de DIV sous IE

Posté par Scalpweb, le vendredi 14 septembre 2007 à 15:25:18
Bonjour à tous !

Voici le site sur lequel je travail actuellement :

www.devavoirlesite.fr/Emilie

Il fonctionne comme je le désire sur firefox, mais sous IE, le texte du menu est décallé d'une case, impossible de savoir pourquoi...

Pourriez-vous me donner un coup de main ?

Merci d'avance,
Scalp
Configuration: Windows Vista
Firefox 2.0.0.6
Répondre à Scalpweb  Signaler ce message aux modérateurs Aller au dernier message

1


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Dalida, le vendredi 14 septembre 2007 à 15:33:20
salut,

je n'ai pas trouvé le décalage mais tu devrais penser à une mise en page sans tableaux tu auras moins de soucis.
tutos W3C et AlsaCréations
et tu devrais enregistrer tes images en "png" plutôt qu'en "bmp".
[ Mathieu ]
"Les jeunes c'est l'insécurité
il faudrait tous les enfermer!" BxN 1985
   
Répondre à Dalida

2


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Scalpweb, le vendredi 14 septembre 2007 à 15:53:42
Chez moi j'ai bien un décalage...

Tout les texte sont décalé d'un bouton, ce qui donne que le dernier texte n'ets sur aucun bouton...
   
Répondre à Scalpweb

3


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Dalida, le vendredi 14 septembre 2007 à 16:10:22
oui moi aussi j'ai le décalage mais je n'ai pas trouvé pourquoi…
et je n'ai pas le temps maintenant d'éplucher le code.
[ Mathieu ]
"Les jeunes c'est l'insécurité
il faudrait tous les enfermer!" BxN 1985
   
Répondre à Dalida

4


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Scalpweb, le vendredi 14 septembre 2007 à 16:27:40
Ca se résume au code si-dessous :
Sous IE, le texte n'est pas sur le bouton, sous firefox oui :

<html>
<body>

<table>
<tr>
<td style="z-index: 1; height: 60px; background-image: url(./Images/fond_haut_menu.bmp);">
<img id="B1" style="z-index: 1; position: relative;" src="Images/fond_bouton.bmp" align="left" alt="" />
<div style="width: 79px; padding-top: 5px; z-index: 100; position: absolute;">
<center><font size="2" color="white" face="Comic Sans MS">
<a href="" onmouseout="SetFond('B1');" onmouseover="SetBouton('B1');">Accueil</a>­;
</font></center>
</div>
</td>
</tr>
</table>

</body>
</html>
   
Répondre à Scalpweb

5


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Dalida, le vendredi 14 septembre 2007 à 16:36:08
tu joues avec les "position:relative" et position:absolute" il ne doit pas aimer.
tu ferais mieux de mettre l'image en background du "<a>" avec un {display:block;}.
et pour le comportement tu changes le 'background-image" avec le sélecteur "a:hover".

c'est la technique classique en html/css.
des exemples ici et là.
et comme ça la sémantique de ton document sera plus correcte.
[ Mathieu ]
"Les jeunes c'est l'insécurité
il faudrait tous les enfermer!" BxN 1985
   
Répondre à Dalida

6


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
RAD ZONE, le vendredi 14 septembre 2007 à 16:36:22
SALUT

je ne sais pas si cela vient de la mais il y as beaucoup d erreurs dans ton code et l utilisations de table et du "style" embarque :((((((((((

des <div> et un css externe aurais ete bien mieux ! mais bon

essaye avec le code pas mal nettoye

il reste quelque probleme de height et backround sur les tables (une dixaine) mais essaye si tu as toujours le decalage avec ce code ?? 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dt­d">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <meta name="description" content="emilie" />
    <meta name="keywords" content="" />
    <meta name="author" content="scalpweb" />
    <meta name="identifier-url" content="http://www.devavoirlesite.fr/emilie" />
    <meta name="copyright" content="©2007 mugnier pascal" />
    <title> emilie - test
    </title>
    <link rel="stylesheet" type="text/css" href="includes/style.css" />
<script type="text/javascript" src="includes/script.js">
</script>
    <style type="text/css"> /* /*
      /*     
       <![CDATA[*/
body {
	background-color: black;
}
td.c9 {
	padding-top: 15px;
	padding-left: 40px;
	padding-right: 40px;
}
td.c8 {
	height: 29px;
	background-image: url(./Images/fond_haut_menu.bmp);
}
img.c7 {
	z-index: 1;
	position: relative;
}
td.c6 {
	z-index: 1;
	height: 60px;
	background-image: url(./Images/fond_haut_menu.bmp);
}
div.c5 {
	width: 79px;
	padding-top: 5px;
	z-index: 100;
	position: absolute;
}
img.c4 {
	z-index: 1;
}
td.c3 {
	width: 50%;
	height: 29px;
	background-image: url(./Images/fond_haut_menu.bmp);
}
td.c2 {
	padding-top: 8px;
}
div.c1 {
	display: none;
}
/*]]> */
	</style>
  </head>
  <body>
    <div class="c1">
      <img src="Images/bouton.bmp" alt="Image" />
    </div>
    <table cellspacing="0"  height="100%" width="100%">
      <tbody>
        <tr valign="middle">
          <td width="100%">
            <table cellspacing="0"  width="90%" height="100%">
              <tbody>
                <tr valign="top" height="100%">
                  <td width="373" class="c2">
                    <img src="Images/fond_gauche_2.JPG" alt="Image" /></td>
                  <td width="100%">
                    <table cellspacing="0" >
                      <tbody>
                        <tr valign="middle">
                          <td class="c3"></td>
                          <td class="c6">
                            <img id="B1" class="c4" src="Images/fond_bouton.bmp" align="left" alt="Image" />
                            <div class="c5">
                              <a href="#" onmouseout="SetFond('B1');" onmouseover="SetBouton('B1');">Accueil</a>­;<br />
                            </div></td>
                          <td class="c8">
                            <img id="B2" class="c7" src="Images/fond_bouton.bmp" align="left" alt="Image" />
                            <div class="c5">
                              <a href="#" onmouseout="SetFond('B2');" onmouseover="SetBouton('B2');">News</a>&l­t;br />
                            </div></td>
                          <td class="c8">
                            <img id="B3" class="c7" src="Images/fond_bouton.bmp" align="left" alt="Image" />
                            <div class="c5">
                              <a href="#" onmouseout="SetFond('B3');" onmouseover="SetBouton('B3');">Bio</a><­;br />
                            </div></td>
                          <td class="c8">
                            <img id="B4" class="c7" src="Images/fond_bouton.bmp" align="left" alt="Image" />
                            <div class="c5">
                              <a href="#" onmouseout="SetFond('B4');" onmouseover="SetBouton('B4');">Médias</a>­<br />
                            </div></td>
                          <td class="c8">
                            <img id="B5" class="c7" src="Images/fond_bouton.bmp" align="left" alt="Image" />
                            <div class="c5">
                              <a href="#" onmouseout="SetFond('B5');" onmouseover="SetBouton('B5');">Groupe</a>­<br />
                            </div></td>
                          <td class="c8">
                            <img id="B6" class="c7" src="Images/fond_bouton.bmp" align="left" alt="Image" />
                            <div class="c5">
                              <a href="#" onmouseout="SetFond('B6');" onmouseover="SetBouton('B6');">Presse</a>­<br />
                            </div></td>
                          <td class="c8">
                            <img id="B7" class="c7" src="Images/fond_bouton.bmp" align="left" alt="Image" />
                            <div class="c5">
                              <a href="#" onmouseout="SetFond('B7');" onmouseover="SetBouton('B7');">Liens</a>&­lt;br />
                            </div></td>
                          <td class="c8">
                            <img id="B8" class="c7" src="Images/fond_bouton.bmp" align="left" alt="Image" />
                            <div class="c5">
                              <a href="#" onmouseout="SetFond('B8');" onmouseover="SetBouton('B8');">Livre d'Or</a><br />
                            </div></td>
                          <td class="c8">
                            <img id="B9" class="c7" src="Images/fond_bouton.bmp" align="left" alt="Image" />
                            <div class="c5">
                              <a href="#" onmouseout="SetFond('B9');" onmouseover="SetBouton('B9');">Contact</a>­;<br />
                            </div></td>
                          <td class="c3"></td>
                        </tr>
                        <tr>
                          <td colspan="11" class="c9">
                            <!-- Case centrale -->
                            <table cellspacing="0"  height="500">
                              <tr height="4">
                                <td width="4">
                                  <img src="Images/tab_hg.bmp" alt="Image" /></td>
                                <td width="100%" background="Images/tab_h.bmp"></td>
                                <td width="4">
                                  <img src="Images/tab_hd.bmp" alt="Image" /></td>
                              </tr>
                              <tr height="490">
                                <td width="4" background="Images/tab_g.bmp"></td>
                                <td width="100%" background="Images/tab_f.bmp">
                                  <h4>Titre de la page en cours</h4>
                                  <h5>Sous-menu éventuel</h5>
                                  <div class="centralText"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
                                  </div>
                                  <h6> Copyright Pascal Mugnier 2007
                                  </h6></td>
                                <td width="4" background="Images/tab_d.bmp"></td>
                              </tr>
                              <tr>
                                <td width="4">
                                  <img src="Images/tab_bg.bmp" alt="Image" /></td>
                                <td width="100%" background="Images/tab_b.bmp"></td>
                                <td width="4">
                                  <img src="Images/tab_bd.bmp" alt="Image" /></td>
                              </tr>
                            </table></td>
                        </tr>
                      </tbody>
                    </table></td>
                </tr>
              </tbody>
            </table><br /></td>
        </tr>
      </tbody>
    </table>
  </body>
</html>


RAD ♣ La plus grande erreur que puisse faire un homme est d'avoir peur d'en faire une. ♣
   
Répondre à RAD ZONE

7


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
 Hannes, le lundi 31 décembre 2007 à 13:35:48
essaies de ne pas utiliser la balise font, car elle est déconseillé par le w3c
question de respecter la norme ;)
   
Répondre à Hannes
Posez votre question Répondre
Logiciels pertinents trouvés dans les téléchargements
Télécharger DivX codecs 6.8.3DivX codecs - Le codec Divx Community est gratuit pour un usage personnel et permet de lire les fichiers au format DivX ! L'installeur...Catégorie: Codecs
Licence: Freeware/gratuit
Télécharger Dr.DivX OSS 2.0.0Dr.DivX OSS - Dr. DivX OSS est une application libre et portable permettant de convertir (transcoder) un grand nombre de formats vidéo...Catégorie: Conversion
Licence: Open Source
Télécharger IETab 1.5.20080618IETab - IE Tab est une extension pour Mozilla Firefox , et uniquement pour les systèmes d'exploitation Windows. Elle permet à une...Catégorie: Extensions Firefox
Licence: Freeware/gratuit
Télécharger DivFix 1.10DivFix - Il est fréquent que lors d'un téléchargement de vidéos ou lors d'un gravage sur CD ou autres supports la vidéo soit...Catégorie: Codecs
Licence: Freeware/gratuit
Plus de logiciels gratuits sur « Problèm de DIV sous IE »