Bonjour,
Je rencontre actuellement plusieurs soucis sur mon site avec IE6 notamment le menu déroulant d'alsacrations.
Il est pourtant précisé qu'il fonctionne j'ai même fait le test avec celui en pésentation sur le site alsa et aucun problème.
Le problème doit venir de moi
Les sous menus n'apparaissent pas ou mal. Voici le lien à ouvrir avec IE6:
http://www.corinne-quirici-photographe.com/index.html
voici le code de la page:
le css pour IE
Merci d'avance pour votre aide précieuse,
Corinne[/i][/i][/i][/i]
Modifié par zellige (08 Feb 2007 - 15:36)
Je rencontre actuellement plusieurs soucis sur mon site avec IE6 notamment le menu déroulant d'alsacrations.
Il est pourtant précisé qu'il fonctionne j'ai même fait le test avec celui en pésentation sur le site alsa et aucun problème.
Le problème doit venir de moi
Les sous menus n'apparaissent pas ou mal. Voici le lien à ouvrir avec IE6:
http://www.corinne-quirici-photographe.com/index.html
voici le code de la page:
<!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" >
<head>
<title>zooming.fr Corinne Quirici et Thierry Rostang Photographes</title>
<meta name="Description" content="" />
<meta name="Keywords" content="" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="fr" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta http-equiv='Page-Exit' content='progid:DXImageTransform.Microsoft.GradientWipe(Duration=1)'/>
<link rel="stylesheet" type="text/css" href="style.css" media="screen, projection" />
<link rel="stylesheet" type="text/css" href="design.css" media="screen, projection" />
<!--[if lte IE 6]>
<link href="ie-only.css" rel="stylesheet" type="text/css" />
<![endif]-->
<script type="text/javascript">
// <![CDATA[
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
for (var i = 1; i<=10; i++) {
if (document.getElementById('smenuderoulant'+i)) {document.getElementById('smenuderoulant'+i).style.display='none';}
}
if (d) {d.style.display='block';}
}
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a.indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a;}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;iA++) x.src=x.oSrc;
}
// ]]>
</script>
<style type="text/css" media="screen">
/*<![CDATA[*/
body {background : url(images/FOND.jpg);}
.gauche {background : url(images/001.jpg);}
/*]]>*/
</style>
</head>
<body>
<!-- barre grise -->
<div id="header"> </div>
<div id="menuderoulant">
<dl>
<dt>Accueil</dt>
</dl>
<dl>
<dt><a href="portfolio.html" title="Galerie photos">Portfolio</a></dt>
</dl>
<dl>
<dt onmouseover="javascript:montre('smenuderoulant1');"><a href="prestations-photos.html" title="Toutes nos prestations pour les particuliers">Prestations
photos</a></dt>
<dd id="smenuderoulant1" onmouseover="javascript:montre('smenuderoulant1');" onmouseout="javascript:montre('');">
<ul>
<li><a href="portrait.html"title="Séance photo portrait">Portrait</a></li>
<li><a href="book.html"title="Séance photo Book">Book</a></li>
<li><a href="mariage.html"title="Reportage photo de mariage">Mariage</a></li>
<li><a href="evenement-famillial.html"title="Naissance, baptême...">Evènement
famillial</a></li>
<li><a href="restauration-photo.html"title="Retouche photo">Restauration
& retouche photos</a></li>
</ul>
</dd>
</dl>
<dl>
<dt onmouseover="javascript:montre('smenuderoulant2');"><a href="prestations-professionnels.html"title="Toutes nos prestations pour les professionnels">Professionnels</a></dt>
<dd id="smenuderoulant2" onmouseover="javascript:montre('smenuderoulant2');" onmouseout="javascript:montre('');">
<ul>
<li><a href="entreprise-reportage.html"title="tous reportages photos">Reportage</a></li>
<li><a href="illustration.html"title="Prise de vue d'illustrations">Illustration</a></li>
<li><a href="reproduction.html"title="Prise de vue d'oeuvres d'art">Reproduction</a></li>
<li><a href="entreprise-creation-pub.html"title="Réalisation,conception pub/catalogue">Publicité/Pack
shot</a></li>
<li><a href="entreprise-catalogue.html"title="Impression de vos supports de communication">Prestations
imprimerie</a></li>
</ul>
</dd>
</dl>
<dl>
<dt onmouseover="javascript:montre('smenuderoulant3');"><a href="zooming/reportage-en-ligne.html"title="Reportages en ligne">En
ligne</a></dt>
<dd id="smenuderoulant3" onmouseover="javascript:montre('smenuderoulant3');" onmouseout="javascript:montre('');">
<ul>
<li><a href="zooming/reportage-en-ligne.html"title="Reportages en ligne">Visionnez
un reportage et achetez vos photos</a></li>
</ul>
</dd>
</dl>
<dl>
<dt onmouseover="javascript:montre('smenuderoulant4');"><a href="boutique.html"title="La boutique">La
boutique</a></dt>
<dd id="smenuderoulant4" onmouseover="javascript:montre('smenuderoulant4');" onmouseout="javascript:montre('');">
<ul>
<li><a href="boutique.html"title="La boutique">Albums,Cadres photos accessoires</a></li>
<li><a href="cadres-sur-mesures.html"title="La boutique">Cadres sur mesure</a></li>
</ul>
</dd>
</dl>
</div>
<div id="logo" > <img src="images/LOGO.jpg" width="900" height="81" alt="Studio photo zooming.fr photographes en Provence" />
</div>
<div class="conteneur">
<div class="gauche"></div>
<div class="droite">
<h1>Un autre regard...</h1>
<div class="hr">
<hr />
</div>
<p>Amateurs de photographies, venez découvrir à travers ce site le regard
de deux photographes professionnels Corinne Quirici < Thierry Rostang
à votre service quelle que soit votre demande [langue]ortrait, mariage, entreprise.
</p>
<p> Zooming. fr c'est aussi une boutique en ligne vous proposant une large
gamme d'albums et de cadres photos mais aussi de cadres sur mesure de fabrication
française irréprochable et bien d'autres articles autour de la photographie...
</p>
<p> <a href="#" class="class2" onclick="window.open('accueil3.html', '_blank', 'width=600,height=450,left=350,top=230,scrollbars=no');"><img src="images/fall_accueil3.jpg" alt="photo d'illustration" width="87" height="84" class="expo" /></a>
<a href="#" class="class2" onclick="window.open('accueil1.html', '_blank', 'width=500,height=500,left=350,top=230,scrollbars=no');"><img src="images/fall_accueil5.jpg" alt="portrait" width="87" height="84" class="expo2" /></a>
<a href="#" class="class2" onclick="window.open('accueil2.html', '_blank', 'width=500,height=550,left=350,top=230,scrollbars=no');"><img src="images/fall_accueil2.jpg" alt="portrait" width="87" height="84" class="expo2" /></a>
</p>
<div class="spacer"></div>
<h1>Découvrez sur Zooming.fr:</h1>
<div class="hr">
<hr />
</div>
<p> <img src="images/arrow.gif"alt="photographe en provence" /> <a href="boutique.html">La
boutique en ligne : albums photos, cadres sur mesure et bien d'autres articles
dasn l'unvivers de la photographie</a> </p>
<p><img src="images/arrow.gif"alt="photographe en provence" /> <a href="prestations-photos.html">L'ensemble
de nos prestations pour les particuliers</a> </p>
<p><img src="images/arrow.gif"alt="photographe en provence" /> <a href="prestations-professionnels.html">L'ensemble
de nos prestations pour les professionnels </a> </p>
<p> <img src="images/arrow.gif" alt="photographe en provence" /> <a href="portfolio.html">Le
portfolio </a> </p>
<p>Ainsi que toutes l'<a href="#"onclick="window.open('actualites.html', '_blank', 'width=700,height=500,left=200,top=150,scrollbars=nooverflow: auto;');">Actualité</a>
de zooming.fr... </p>
</div>
</div>
<div id="pied">
<p> <a href="#" onclick="window.open('a-propos-de-zooming.html', '_blank', 'width=700,height=600,left=200,top=150,scrollbars=no');">A
propos de Zooming</a>| <a href="#" onclick="window.open('cgv.html', '_blank', 'width=720,height=520,left=200,top=150,overflow: auto;');">Conditions
générales de vente </a>| <a href="#" onclick="window.open('http://www.webmasteroo.com/livre/?login=7010', 'width=720,height=520,left=200,top=150,overflow: auto;');">Témoignages</a>
| <a href="#" onclick="window.open('actualites.html', '_blank', 'width=700,height=500,left=200,top=150,scrollbars=nooverflow: auto;');">Actualités</a>|
<a href="#" onclick="window.open('liens.html', '_blank', 'width=720,height=520,left=200,top=150,overflow: auto;');">Nos
liens </a>| <a href="#" onclick="window.open('zooming/formulaire.html', '_blank', 'width=625,height=500,left=200,top=150,scrollbars=no');">Nous
contacter</a> <br />
Design <a href="http://www.zwatla.com"title="Concepteur de site internet">ZWATLA</a>
< <a href="#"title="Webmaster">QUIRICI</a> | Copyright Quirici & Rostang
| <a href="#" onclick="window.open('droits-reserves.html', '_blank', 'width=700,height=200,left=200,top=150,overflow: auto;');">Tous
droits réservés </a> </p>
</div>
</body>
</html>
le css pour IE
body
{
width: 900px;
height: 100%;
margin: auto; /* Pour centrer notre page */
margin-top: 20px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour voir ! */
margin-bottom: 20px; /* Idem pour le bas du navigateur */
font-family: arial,verdana, helvetica, sans-serif;
overflow : auto ; /* hidden evite une barre horizontale */
color: #666666; /* gris très fonce */
font-size: 12px;
}
/* menu deroulant */
dl, dt, dd, ul, li {
margin: 0;
padding: 0x;
list-style-type: none;
}
#menuderoulant {
position:absolute;
z-index:100;
width: 100%;
font-family: verdana,arial,helvetica,sans-sherif;
margin-bottom: 1px;
margin-left: -400px;
left: 50%;
top: 77px;
height: 200px;
text-align: center;
font-size: 11px;
}
#menuderoulant dl {
float: left;
width: 12em; /* grandeur de la case menu */
margin: 0 1px;
}
#menuderoulant dt {
cursor: pointer;
text-align: center; /* texte centré */
font-weight: bold; /* police en gras */
background: #212a2a; /* couleur menu */
border: 1px solid gray; /* contour des menus */
margin: 1px; /* marge entre les menus */
color: white; /* couleur des menus */
}
#menuderoulant dd {
border: 1px solid gray; /* contour des sous menus */
}
#menuderoulant li {
text-align: center;
background: #2e3735; /* gris foncé */
font-weight: bold; /* bold = police en gras */
color: white;
margin: 1px; /* marge entre les menus */
line-height: 16px;
}
#menuderoulant li a, #menuderoulant dt a {
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
color: white; /* couleur des liens */
}
#menuderoulant li a:hover, #menuderoulant dt a:hover {
background: #d5f400; /* vert */
color: black;
}
/* fin menu deroulant */
/* Le menu */
#menu
{
float: left;
width: 140px;
font-family: verdana, helvetica, sans-serif;
font-size:3;
color : black;
}
.element_menu
{
background-color: #ffffff;
border: 1px solid #b1d91a;
margin-bottom: 10px;
padding: 3px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
}
/* Quelques effets sur les menus */
.element_menu h3
{
color: #4586df; /*bleu */
background-color: ;
font-family: VERDANA, Arial, "Arial Black", "Times New Roman", Times, serif;
text-align: center;
}
.element_menu ul
{
list-style-image: url(images/arrow.gif);
padding: 1px;
padding-left: 20px;
margin: 1px;
margin-bottom: 5px;
}
.element_menu a
{
color: #666666;
}
.element_menu a:hover
{
background-color:#d5f400; /*vert*/
color: #4586df; /*bleu */
display: block;
}
/* fin Quelques effets sur les menus */
/* Quelques effets sur les liens */
a:active /* Quand le visiteur clique sur le lien */
{
background-color: #4586df; /*bleu */
}
a:hover /* Quand le visiteur pointe sur le lien */
{
color: #4586df; /*bleu */
text-decoration: none;
background-color: #d5f400; /*vert */
}
a /* liens */
{
color:#4586df; /*bleu */
background-color:transparent;
text-decoration:none; /*surligné=underline*/
}
TABLE, TD {
font-family: Verdana;
font-size: 11px;
}
#centpourcent {
height: 100%;
width: 100%;
}
H1 {
font-family: Tahoma, Verdana;
color: #a7c300; /* vert*/
font-weight: bold;
font-size: 14pt;
margin: 8px 0px 0px 0px;
padding: 0px;
}
H2 {
font-family: Tahoma, Verdana;
color: #a7c300; /* vert*/
font-weight: bold;
font-size: 13pt;
margin: 5px 0px 10px 0px;
padding: 0px;
}
HR {
width: 100%;
background-color: #b1d91a; /* vert*/
color: #b1d91a; /* vert*/
border: 0px;
height: 1px;
}
.plusdedetail {
font-family: Verdana;
font-size: 8px;
color: #666666;
}
a.plusdedetail:link, a.plusdedetail:visited {
font-family: Verdana;
font-size: 9px;
color: #666666; /* vert*/
text-decoration: underline;
width: 100%;
z-index: 170;
}
a.plusdedetail:hover, a.plusdedetail:active {
color: #666666;
text-decoration: underline;
width: 100%;
z-index: 170;
}
.prix {
font-family: Tahoma, Verdana;
color: #b1d91a; /* vert*/
font-weight: bold;
font-size: 13pt;
}
#logo
{
position:absolute;
margin-left: -430px;
left: 50%;
top: 0px;
height: 81px;
z-index:1;
}
#pied
{
position:absolute;
z-index:1
width:100%;
height:43px;
background: url(images/a2.gif) repeat-x;
text-align: center;
color: #CCCCCC;
font-size: 11px;
}
#pied a, #pied a:active{
text-decoration: none;
color: #CCCCCC; /* vert */ /* couleur des liens */
}
#pied a:hover{
background: #d5f400; /* vert */
color: black;
}
/* fin pied */
HTML, BODY {
margin: 0px;
padding: 0px;
border: none;
width: 100%;
height: 100%;
}
#header
{
position:fixed;
width: 100%;
height: 100px;
background-color: #4d4d4d;
background: url(images/a1.gif) repeat-x;
z-index:1
}
Merci d'avance pour votre aide précieuse,
Corinne[/i][/i][/i][/i]
Modifié par zellige (08 Feb 2007 - 15:36)
