pre invisible sous IE

artaud · Message par **artaud** » 30 sept. 2006, 08:49

Bonjour,
j'ai pris un exemple de tuto chez Alsacréations, l'ai réalisé avec Nvu ;
le pb est que celui s'affiche correctement sous Firefox, et n'affiche pas le pre sous IE.
Quelqu'un aurait-il une idée, merci.

Code : Tout sélectionner

<!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" lang="fr">
<head>
  <title>bonjour_monsieur</title>
  <meta http-equiv="Content-Type"
 content="text/html; charset=ISO-8859-15" />
  <meta http-equiv="Content-Style-Type" content="text/css" />
  <meta http-equiv="Content-Language" content="fr" />
  <style type="text/css">

body {
margin: 10px 0pt;
padding: 0pt;
text-align: center;
font-family: Trebuchet MS,helvetica,sans-serif;
background-color: #000066;
}
div#conteneur {
border: 2px solid #aabb44;
margin: 0pt auto;
width: 770px;
text-align: left;
background-color: #ffffff;
}
h1#header {
margin: 0pt;
background-repeat: repeat-y;
background-attachment: fixed;
background-position: left top;
background-image: url(Images/DSCN3041.jpg);
height: 210px;
}
h1#header a {
border-width: 1px;
left: 200px;
position: relative;
margin-left: 150px;
display: block;
top: 60px;
height: 70px;
width: 230px;
background-repeat: no-repeat;
background-image: url(Images/europe.jpg);
background-position: right bottom;
}
ul#menu {
margin: 0pt;
padding: 0pt;
background-repeat: repeat-x;
background-attachment: scroll;
list-style-type: none;
background-image: url(Images/super.jpg);
height: 35px;
background-position: right top;
}
ul#menu li {
text-align: center;
float: left;
color: #330033;
}
ul#menu li a {
border-right: 1px solid #ccffff;
font-weight: bold;
letter-spacing: 2px;
display: block;
color: #ffffff;
width: 180px;
text-decoration: underline;
font-size: 0.8em;
line-height: 35px;
}
ul#menu li a:hover {
background: transparent url(Images/DSCN3041.jpg) repeat-x scroll 0pt 50%;
-moz-background-clip: initial;
-moz-background-origin: initial;
-moz-background-inline-policy: initial;
}
div#contenu {
padding: 0pt 15px;
background-color: transparent;
background-repeat: no-repeat;
margin-right: 35px;
margin-left: 45px;
background-image: url(Images/DSCN3041.jpg);
background-position: center;
}
div#contenu h2 {
border-bottom: 1px solid #99bb22;
background-color: transparent;
line-height: 25px;
font-size: 1.4em;
margin-left: 45px;
margin-right: 30px;
padding-left: 25px;
background-repeat: no-repeat;
background-image: url(Images/DSCN3041.jpg);
background-position: right bottom;
color: #ffffff;
}
div#contenu h3 {
border-left: 3px solid #99bb22;
border-bottom: 1px solid #99bb22;
margin-left: 15px;
background-repeat: repeat;
padding-left: 5px;
color: #ffffcc;
background-position: left center;
}
div#contenu p {
text-align: justify;
text-indent: 2em;
line-height: 1.7em;
}
div#contenu a {
color: #000066;
}
div#contenu a:hover {
color: #99bb22;
}
p#footer {
margin: 0pt;
padding-right: 10px;
line-height: 30px;
text-align: right;
color: #336666;
}
pre {
border: 1px solid #99bb22;
padding: 5px 0pt 0pt 5px;
background-repeat: repeat;
background-attachment: scroll;
background-position: 0% 50%;
overflow: auto;
font-size: 1.2em;
background-image: url(Images/DSCN3041.jpg);
color: #660000;}
* html pre {
width: 636px;
}
pre span {
color: #556600;
}
pre span.comment {
color: #b30000;
}
  </style>
</head>
<body style="direction: ltr;">
<div id="conteneur">
<h1 id="header"><a href="l%27Europe.html"
 title="L'Europe et la d&eacute;fense"><span
 style="font-family: Didot; color: rgb(51, 0, 51); font-size: 1em; text-decoration: underline;">L'Europe
et la &nbsp;d&eacute;fense</span></a></h1>
<ul id="menu">
  <li><a href="etape1.html">Les alliances</a></li>
  <li><a href="etape2.html">Les crises</a></li>
  <li><a href="etape3.html">Les Etats</a></li>
  <li><a href="etape4.html">L'Union</a></li>
</ul>
<div id="contenu">
<h2><sup>Introduction</sup></h2>
<p>Un paragraphe</p>
<pre>body
{
margin:10px 0 ;
padding:0 ;
text-align:center ;
font:0.8em "Trebuchet MS", helvetica, sans-serif ;
background: #dea ;kjkjkjkljslkjlkqsjfqkslfjklfjklfjlkfjqlkfjlkfjqlkfjklfjqklfjsqkljqkljqkljkfjkfjqkqjfkqjfkqlfjqlkfjqklfjfkljfklqfjqklfjqklfjlfjqflkjsfkljsfkskfkqjfkjfkqfkl
lmllllllllll
sdsd
sdsdds
sdsdsds
sdsds
sd
</pre>
<p>Et bien voici notre page cod&eacute;e, propre
l&eacute;g&egrave;re, pr&egrave;te &agrave;
&ecirc;tre utilis&eacute;e, voyons donc un exemple de ce que
cel&agrave; peut bien donner &agrave; l'<a href="etape5.html">&eacute;tape
n&deg;5</a> avec un contenu fictif.</p>
<p><a
 href="http://css.alsacreations.com/Faire-une-mise-en-page-sans-tableaux/design_css">Retour
&agrave; la page de pr&eacute;sentation du tutoriel</a></p>
</div>
<p id="footer">R&eacute;alisation des codes xhtml
& css,
du tutoriel et du design par ElMoustiko</p>
</div>
</body>
</html>

Message envoyé avec : Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; fr; rv:1.8.0.7) Gecko/20060909 Firefox/1.5.0.7

Message par **chinon37** » 30 sept. 2006, 09:51

qu'entends tu par: "n'affiche pas le pre sous ie"?
Si c'est la barre de defilement verticale, elle est induite par ta règle:

Code : Tout sélectionner

pre {
overflow: auto;
}

Invité · Message par **Invité** » 30 sept. 2006, 10:10

J'aurai bien envoyé l'image, mais franchement j'y arrive pas essaye encore
[img]http://image_url/Images/essai1.jpg[/img]

le pre apparait bien avec Firefox, mais il n'apparait pas sous IE (un filet!)

Message envoyé avec : Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; fr; rv:1.8.0.7) Gecko/20060909 Firefox/1.5.0.7

artaud · Message par **artaud** » 30 sept. 2006, 11:15

Voilà, le pre qui n'apparait pas sous IE.

Message envoyé avec : Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; fr; rv:1.8.0.7) Gecko/20060909 Firefox/1.5.0.7

Et le pre qui apparait sous Firefox

calimo · Message par **calimo** » 30 sept. 2006, 11:29

Sous Linux, le IE6 sp1 installé par IE4Linux affiche bien le pre

Tu as un exemple en ligne ?

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.0.7) Gecko/20060921 Firedragon/dapper-security Firefox/1.5.0.7

artaud · Message par **artaud** » 30 sept. 2006, 11:48

http://192.168.0.2/~franckchastan/bonjour_monsieur[/url]

Est-ce que ça marche ?
Message envoyé avec : Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; fr; rv:1.8.0.7) Gecko/20060909 Firefox/1.5.0.7

Message par **chinon37** » 30 sept. 2006, 12:17

Non, nous ne sommes pas branchés sur ton réseau interne (192.168.0.2):evil:
Il nous faut un exemple en ligne sur le net

Invité · Message par **Invité** » 30 sept. 2006, 13:59

Bon,

http://perso.orange.fr/franck.chastan/

Message envoyé avec : Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; fr; rv:1.8.0.7) Gecko/20060909 Firefox/1.5.0.7

Message par **Ymai** » 30 sept. 2006, 15:11

OK, tant sous IE que sous FF.

L'image de fond qui pèse 150 Ko me paraît peut-être un peu lourde.

artaud · Message par **artaud** » 30 sept. 2006, 15:17

Merci,

alors c'est peut-être mon IE 5.5 à moi.
En tout cas merci d'avoir jeté un œil

Message envoyé avec : Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; fr; rv:1.8.0.7) Gecko/20060909 Firefox/1.5.0.7

calimo · Message par **calimo** » 30 sept. 2006, 17:12

artaud a écrit :alors c'est peut-être mon IE 5.5 à moi.

IE/Mac ? Il est totalement différent du IE qu'on peut trouver sous Windows !

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.0.7) Gecko/20060921 Firedragon/dapper-security Firefox/1.5.0.7

artaud · Message par **artaud** » 30 sept. 2006, 17:33

Oui, en vérité je ne sais pas si beaucoup d'utilisateurs mac utilisent encore IE, je crois qu'il n'a pas bougé depuis longtemps Firefox, à titre personnel, je trouve que c'est le mieux
J'avais encore des doutes, alors ai regardé ma page avec Opera, Safari, Shiira, Camino et tout a l'air de bien sortir.

Message envoyé avec : Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; fr; rv:1.8.0.7) Gecko/20060909 Firefox/1.5.0.7

Geckozone

pre invisible sous IE

pre invisible sous IE

Qui est en ligne ?