Tableau et IE7.

**defacta** · 27/08/2009, 07h53

Salut,

Comme d'hab c'est IE7 qui pose un problème, ce que j'ai codé passe bien avec Safari, Firefox, Google Chrome et Opera...

Voici le lien:
http://www.elizanet.com/

Sous Identifiant, y a "Un peu de texte ici" et avec IE7 tout est décalé, pourtant le code est correct puisque l'affichage est celui escompté avec TOUS les autres navigateurs.

Le code:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<table height="59px" width="100%" border="0" cellpadding="0" cellspacing="0">
  <tr>
 
   <td rowspan="3" height="59px" width="44px" style="padding-left:5px" align="center" ><img src="images/logo-top-menu.gif">
  </tr>
  <tr >
   <td  heigth="35px" >
     <img height="7px" src="images/trans.gif"><br>
     <table height="28px" width="100%" style="background-image: url(images/top-bar.png);" border="0" cellpadding="0" cellspacing="0">
       <tr>
         <td width="480px" valign="top" style="padding-left:10px; padding-right:10px" nowrap><b><iframe id="iframe_login" name="iframe_login" src="iframe_login.php" width="100%" marginheight="0" allowtransparency="true" marginwidth="0" height="28px" scrolling="no" frameborder="0"></iframe></td>
 
         <td style="padding-left:40px" width="2%" nowrap> &nbsp;PicBook: Lettres à Elise </td>
         <td width="20%" style="padding-top:1px" nowrap align="left"> &nbsp;<b><a href="#" onClick="JS_dis_picbooks();"><font style="font-size : 1.3em; font-family : Arial; ">| V |</a></font> </td>
         <td width="10%" nowrap><img height="28px" src="images/trans.gif"></td>
         <td width="10%" ><img height="28px" src="images/trans.gif"></td>
        <td style="padding-right:10px" nowrap>Société ElizaNet</td>
       </tr>
 
     </table>
   </td>
  </tr>
  <tr>
   <td heigth="24px">
     <img height="5px" src="images/trans.gif"><br>
     <table height="19px" border="0" cellpadding="0" cellspacing="0">
       <tr>
         <td style="padding-right:8px; border-right:1px solid black; border-bottom: 1px solid black; border-top: 1px solid black; background-image: url(images/top-bar.png);"><b>Un peu de texte ici...</b>
 
         </td>
       </tr>
      </table>
    </td>
  </tr>
</table>

Vous auriez une idée pour faire passer le tout avec IE7 ou faut que je fasse un test JavaScript pour identifier ce sous navigateur et décaler le tout ?

Merci,
Vincent.

FoxLeRenard · 27/08/2009, 08h13

Envoyé par defacta

Salut,

Comme d'hab c'est IE7 qui pose un problème, ce que j'ai codé passe bien avec Safari, Firefox, Google Chrome et Opera...

Voici le lien:
http://www.elizanet.com/

Sous Identifiant, y a "Un peu de texte ici" et avec IE7 tout est décalé, pourtant le code est correct puisque l'affichage est celui escompté avec TOUS les autres navigateurs.

Merci,
Vincent.

Comprends pas

chez moi en IE7 c'est parfait, du reste au passage, c'est super beau

Tout de même une remarque de taille, tu devrais mettre un DOCTYPE
et en plus si tu te mets en strict, tous les navigateurs réagiront pareil !

**defacta** · 27/08/2009, 08h28

Envoyé par FoxLeRenard

Comprends pas

chez moi en IE7 c'est parfait, du reste au passage, c'est super beau

Merci pour la remarque, ça fait plaisir, mais c'est pas fini, tout est en dev., j'espère finir la première monture d'ici 1 semaine...

J'ai une question vraiment bête, c'est quoi un DOCTYPE, ca sert à quoi et je mets lequel ?

Comme tu dis que ça passe avec ton IE7, je ne touche à rien...

Sinon, j'utilise IE7 sous Windows XP PRO tournant avec Parallels Desktop, je suis sous Mac en fait ! Je vais faire une upgrade vers IE8 et installer multiIE.

Merci,
Vincent.

FoxLeRenard · 27/08/2009, 10h06

Envoyé par defacta

J'ai une question vraiment bête, c'est quoi un DOCTYPE, ca sert à quoi et je mets lequel ?
Merci,Vincent.

Pour le DOCTYPE il y a les deux PREMIERES lignes a mettre tel quelles
je te mets quelques une derriére au cas ou ça te serve !
LE BUT dire aux navigateurs comment interpréter les feuilles de style,
si non chaque navigateur utilise sa base a lui

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
 
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN'  'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='fr' lang='fr'>
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>xxxxxxxxxxxxxxxx (site officiel)</title>
<meta name="keywords" content="sssssssssss" />
<meta name="description" content="ssssss" />
<meta name="robots" content="all" />
<meta http-equiv="content-language" content="fr, en" />
<meta name="expires" content="never" />
<meta name="rating" content="general" />
<meta name="revisit-after" content="30 days" />
<link rel="shortcut icon" type="image/x-icon" href="http://www.elizanet.com/favicon.ico" />
<link rel="stylesheet" href="include/css/default.css" type="text/css" media="all"  />
</head><body>

Envoyé par defacta

Sinon, j'utilise IE7 sous Windows XP PRO tournant avec Parallels Desktop, je suis sous Mac en fait !
Merci,Vincent.

Ahrrrrrrrrrrrrr ............. je comprends mieux !!

**HiRoN** · 27/08/2009, 14h07

Bonjour,

Pour le DocType : Explication / Utilisation

**defacta** · 27/08/2009, 15h12

Salut,

Je viens d'upgrader en IE8 et le texte est toujours décalé vers le bas avec ma version de Windows XP.

Voilà une screenshot (Voir au de "Un petit texte ici"):
http://www.elizanet.com/screenshots/...xte_decale.png

Quelqu'un pour me confirmer que cela marche chez lui, chez moi cela ne passe pas en l'état...

Merci,
Vincent.

**HiRoN** · 27/08/2009, 15h41

Envoyé par defacta

Quelqu'un pour me confirmer que cela marche chez lui, chez moi cela ne passe pas en l'état...

J'ai bel et bien le même problème sous IE 7/8...

Je n'aurais personnellement pas utilisé un tableau pour faire cette mise en forme... (normalement réservé à l'affichage de données tabulaires)

**defacta** · 27/08/2009, 16h30

Envoyé par HiRoN

J'ai bel et bien le même problème sous IE 7/8...

Je n'aurais personnellement pas utilisé un tableau pour faire cette mise en forme... (normalement réservé à l'affichage de données tabulaires)

Oui je sais, maintenant les codeurs utilisent des <div> et des <span>, mais je n'y vois aucune logique dans cette voie.
Un tableau, c'est clair, c'est carré, on sait où se trouve chacune des cellules.

Le faire avec des div, c'est mettre des <div dans des <div, j'aime pas ça, c'est plus long à coder tout ça pour obtenir le même résultat qu'avec des tableaux et le pire, c'est que coder avec des <div et des <span devient beaucoup plus coton pour avoir le même affichage avec tous les navigateurs.

Maintenant IE me gave vraiment, j'ai codé ce tableau en moins de 20 min, ça marche avec tous les navigateurs, sauf avec lui, et je sens que je vais perdre des heures à cause de ce navigateur.
Il me tarde de voir microsoft perdre la guerre des OS...

**zebulon94** · 27/08/2009, 16h39

Bonjour je galère aussi à adapter mon site aux IEs. Le site en en <div> je n'utilise que les <table> pour l'affichage de certaines infos.

Je viens de regarder ton site et vai faire mon relou

, n'oubli pas d'apposer les mentions légales et voir (si tu gère des données persos ) de contacter la CNIL. Ils deviennent de plus en plus exigeant dessus.

Ton site est très zolie je l'aime beaucoup

D.

**defacta** · 27/08/2009, 17h11

Envoyé par zebulon94

Bonjour je galère aussi à adapter mon site aux IEs. Le site en en <div> je n'utilise que les <table> pour l'affichage de certaines infos.

Je viens de regarder ton site et vai faire mon relou

, n'oubli pas d'apposer les mentions légales et voir (si tu gère des données persos ) de contacter la CNIL. Ils deviennent de plus en plus exigeant dessus.

Ton site est très zolie je l'aime beaucoup

D.

Merci pour la dernière remarque.

Sinon, je ne ferais pas héberger mon site en France, d'ailleurs je cherche un bon hébergeur aux US car ce qui m'intéresse avant tout c'est la liberté d'expression dont jouissent les américains, on peut y critiquer une marque ou autre grâce au 1er amendement:
http://fr.wikipedia.org/wiki/Constitution_des_États-Unis_d'Amérique:
Le Congrès ne fera aucune loi qui touche l'établissement ou interdise le libre exercice d'une religion, ni qui restreigne la liberté de parole ou de la presse, ou le droit qu'a le peuple de s'assembler paisiblement et d'adresser des pétitions au gouvernement pour le redressement de ses griefs.

Si quelqu'un en connaît un, même un peu cher, je suis preneur de l'info.

Merci,
Vincent.

**HiRoN** · 27/08/2009, 17h43

Envoyé par defacta

Oui je sais, maintenant les codeurs utilisent des <div> et des <span>, mais je n'y vois aucune logique dans cette voie.
Un tableau, c'est clair, c'est carré, on sait où se trouve chacune des cellules.

Le faire avec des div, c'est mettre des <div dans des <div, j'aime pas ça, c'est plus long à coder tout ça pour obtenir le même résultat qu'avec des tableaux et le pire, c'est que coder avec des <div et des <span devient beaucoup plus coton pour avoir le même affichage avec tous les navigateurs.

Maintenant IE me gave vraiment, j'ai codé ce tableau en moins de 20 min, ça marche avec tous les navigateurs, sauf avec lui, et je sens que je vais perdre des heures à cause de ce navigateur.
Il me tarde de voir microsoft perdre la guerre des OS...

Tout est surtout question d'habitude, de volonté de faire du code de qualité et sémantiquement juste...

**defacta** · 27/08/2009, 19h37

Envoyé par HiRoN

Tout est surtout question d'habitude, de volonté de faire du code de qualité et sémantiquement juste...

Personnellement, j'ai horreur de ce genre de code qui vient de How' That
http://www.howsthat.ie/:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
	<div class="obl">
		<div class="tr">
			<div class="bl">
				<div class="br">
					<div class="cnt">
			  		<div class="left"><div class="dater">(10 Aug 07)</div><div class="n-titlel2">Music Concerts</div><div class="clear"></div>
 
			  		<p>How's that? Ltd plodded through the mud, wind and rain, to provide our OB facilities for one of the most respected music festivals in Europe... Oxegen                                             ... <a href="http://www.howsthat.ie/done/?client_id=84">Read more</a></p>
 
</div><img src="http://www.howsthat.ie/clients_videos/46ceffe20874b.jpg" class="cl" />
			  		<div class="clear"></div>
					</div>			
			  	</div>
		  	</div>
		</div>
 
	</div>

Et pourtant, c'est moi qui l'ait fait, mon chef m'obligeait à utiliser les <div>, c'est 10 fois plus dur pour un résultat similaire à une utilisation de tableaux.

Vraiment, c'était insupportable de devoir perdre autant de temps à faire des <div> qui partaient dans tous les sens et dont le résultat dépendait vraiment du navigateur. Pour faire plus simple, je trouvais débile de m'obliger à coder de cette façon:
1/ Ca prend plus de temps.
2/ Le résultat est le même qu'avec l'utilisation de tableaux
3/ Cela ne permet pas un affichage particulier, on peut déjà tout faire avec les tableaux.
4/ L'imbrication des <div> dans les <div> est casse-tête.
5/ Le résultat diffère TOUJOURS au début entre les navigateurs et pour trouver le bon CSS qui permet le même affichage quelque soit le navigateur est long et fatiguant.

Sinon, IE m'a tellement pris la tête que j'en ai fini par faire ce que je voulais éviter, une fonction qui permet de remettre IE dans le droit chemin:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
function JS_IE_FixDisBug() {
  if(IsIE) { document.getElementById('TD_SpaceMenuTop').style.paddingTop = 4 ; }
  if(IsIE) { document.getElementById('TD_SpaceMenuTop2').style.paddingTop = 1 ; }
}

J'ai failli appeler la fonction JS_FuckIE_DisBug. lol.
Donc avec IE, la page http://www.elizanet.com/ s'affiche maintenant correctement mais on peut voir que le menu du haut se décale vers le haut à la fin du chargement de la page !

Merci pour vos réponses,
Vincent.

PS: J'avais fait quelque chose de correct qui marchait avec tous les navigateurs il n'était même pas 08h00 du mat: comment perdre une journée entière à cause de microsoft...

FoxLeRenard · 27/08/2009, 23h41

Envoyé par defacta

Personnellement, j'ai horreur de ce genre de code qui vient de How' That

Bien sur tu fera comme tu veux pour les DOCTYPE, mais ton site réagira différement quand tu les auras mis

**HiRoN** · 28/08/2009, 11h57

@defacta : Je n'argumenterai pas plus sur ce sujet (plutôt controversé), le mieux serait d'aller voir ici qui donnera une complément d'infomations sur divers point de vue avec argumentation

(ce thread n'étant nullement l'endroit pour en débattre).

Dans tous les cas, chacun code comme il veut

Tableau et IE7.

HTML

Discussions similaires

Partager

Partager