|
Posté le 12/01/2008 @ 14:28 |
Petit astucien
| Bonjour voila je suis en tain d'apprendre à réalisé un site avec CSS mais la je rencontre une problématique avec la compatibilité avec IE6 ET IE7 en faite le sur mozilla tout les bloc sans a leur place mais quand je vis sur IE les blocs disparu ou et ils ne sont plus a leur place voila le lien pour voir http://lorractu.idev-hosting.info/ pour les feuille de style c'est main.css voila le code body { margin: 0px 0 0; font: .70em "Helvetica", Arial, Sans-Serif; background-image: url(../images/bg.gif); background-repeat: repeat-x; } h1 { font-size: 2.3em; } h2 { font-size: 1.8em; color: #5c5b57; } a { color: #960a0d; } a:hover { color: #960a0d; text-decoration: none; } img { border: 0; } .red { color: #960a0d; } .grey { color: #5c5b57; } p { font-size: 1.2em; color: #5c5b57; } #header { width: 995px; height: 235px; margin: 0 auto; background-image: url(../images/top.jpg); } #wrap, wrap a { width: 995px; background: #fff url; margin-right: auto; margin-left: auto; padding-left: 0px; color: #960a0d; padding-top: 9px; } #header #logo { width: 995px; height: 133px; background:transparent url(../images/logo.png) repeat scroll 0%; background-repeat: no-repeat; background-position: 0px 24px; } #header #pub { width: 995px; height: 70px; background-image: url(../images/Banniere_animee.gif); background-repeat: no-repeat; background-position: 300px 5px; padding-top: 9px; } #header #recherche { background:transparent url(../img/elements/dotted_vertical.gif) repeat-y scroll 0%; float:right; padding:20pt 0pt 14px 13px; } #header #header #recherchebis { background:transparent url(../img/elements/dotted_vertical.gif) repeat-y scroll 0%; float:right; padding:20pt 0pt 14px 13px; } #header #flashnews { color:#083266; font-size:1em; left:469px; position:absolute; text-transform:uppercase; top:184px; width: 719px; } #header #mise_jour { clear:both; color:#083266; display:block; font-size:1em; font-weight:bold; margin:3px 0pt 0pt 10px; width:220px; position:absolute; left: 230px; top: 181px; } .nav{ color: #960a0d; padding-right: auto; font-size: 14px; } .nav a{ color: #960a0d; text-decoration: none; padding-left: 9px; padding-right: 9px; } .col-left { float: left; width: 476px; border:1px solid #CCCCCC; height:auto; padding:0pt 10px 0pt 10px; } .col-middle { float: left; width: 120px; padding-top: 52px; padding-right: 20px; border:1px solid #CCCCCC; height:auto; padding-left:10px; } .col-right { float: left; width: 308px; border:1px solid #CCCCCC; padding-top: 52px; padding-right: 20px; height:auto; padding-left:10px; } .footer { padding-top: 110px; background-image: url(../images/bgFooter.gif); background-position: bottom; height: 50px; background-repeat: repeat-x; color: #7a7a77; clear: both; margin-bottom: 0px; width: 995px; margin: 0 auto; } .footer a { color: #7a7a77; text-decoration: none;}
et pour la feuille de style du menu vloia le code ul#navigation-1 { margin:0; padding:1px 0px; list-style:none; width:932px; height:21px; font:normal 8pt verdana, arial, helvetica; position:absolute; top: 210px; left: 223px; } ul#navigation-1 li { margin:0; padding:1; display:block; float:left; position:relative; width:148px; } ul#navigation-1 li a:link, ul#navigation-1 li a:visited { padding:4px 0; display:block; text-align:center; text-decoration:none; background:transparent; color:#960a0d; width:148px; height:13px; } ul#navigation-1 li:hover a, ul#navigation-1 li a:hover, ul#navigation-1 li a:active { padding:4px 0; display:block; text-align:ceter; text-decoration:none; background:transparent; color:#960a0d; width:147px; height:13px; border-left:1px solid #960a0d; border-right:1px solid #960a0d; } ul#navigation-1 li ul.navigation-2 { margin:0; padding:1px 1px 0; list-style:none; display:none; background:#ffffff; width:146px; position:absolute; top:21px; left:-1px; border:1px solid #b9121b; border-top:none; } ul#navigation-1 li:hover ul.navigation-2 { display:block; } ul#navigation-1 li ul.navigation-2 li { width:146px; clear:left; width:146px; }
ul#navigation-1 li ul.navigation-2 li a:link, ul#navigation-1 li ul.navigation-2 li a:visited { clear:left; background:#ffffff; padding:4px 0; width:146px; border:none; border-bottom:1px solid #ffffff; position:relative; z-index:1000; } ul#navigation-1 li ul.navigation-2 li:hover a, ul#navigation-1 li ul.navigation-2 li a:active, ul#navigation-1 li ul.navigation-2 li a:hover { clear:left; background:#ec454e; padding:4px 0; width:146px; border:none; border-bottom:1px solid #ffffff; position:relative; z-index:1000; }
ul#navigation-1 li ul.navigation-2 li ul.navigation-3 { display:none; margin:0; padding:0; list-style:none; position:absolute; left:145px; top:-2px; padding:1px 1px 0 1px; border:1px solid #b9121b; border-left:1px solid #b9121b; background:#ffffff; z-index:900; } ul#navigation-1 li ul.navigation-2 li:hover ul.navigation-3 { display:block; } ul#navigation-1 li ul.navigation-2 li ul.navigation-3 li a:link, ul#navigation-1 li ul.navigation-2 li ul.navigation-3 li a:visited { background:#ffffff; } ul#navigation-1 li ul.navigation-2 li ul.navigation-3 li:hover a, ul#navigation-1 li ul.navigation-2 li ul.navigation-3 li a:hover, ul#navigation-1 li ul.navigation-2 li ul.navigation-3 li a:active { background:#ec454e; } ul#navigation-1 li ul.navigation-2 li a span { position:absolute; top:0; left:132px; font-size:12pt; color:#fe676f; } ul#navigation-1 li ul.navigation-2 li:hover a span, ul#navigation-1 li ul.navigation-2 li a:hover span { position:absolute; top:0; left:132px; font-size:12pt; color:#ffffff; }
Merci d'avence pour votre aide
|
|
|
|
|
|
Posté le 12/01/2008 à 14:42 |
Maître astucien | Salut Deux choses a faire : changer le charset : <meta http-equiv="content-type" content="text/html; charset=utf-8" />
en <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> Car ton affichage est bizarre !! Ensuite , ôtes tous tes javascripts ( momentanément ) pour voir si ton affichage devient correct !! A+ |
|
Posté le 12/01/2008 à 14:50 |
Astucien | Désolé de revenir là dessus, mais n'oublie pas de corriger les fautes aussi ... Bonjour bien veneu sur la nouvelle version du site lorractu
Bonjour voila je suis en tain d'apprendre à réalisé un site avec CSS mais la je rencontre une problématique avec la compatibilité avec IE6 ET IE7 en faite le sur mozilla tout les bloc sans a leur place mais quand je vis sur IE les blocs disparu ou et ils ne sont plus a leur place voila le lien pour voir http://lorractu.idev-hosting.info/ pour les feuille de style c'est main.css voila le code
Tu pourrais au moins te relire ... |
|
Posté le 12/01/2008 à 15:31 |
Petit astucien
| Malcolm a écrit :
Désolé de revenir là dessus, mais n'oublie pas de corriger les fautes aussi ... Bonjour bien veneu sur la nouvelle version du site lorractu
Bonjour voila je suis en tain d'apprendre à réalisé un site avec CSS mais la je rencontre une problématique avec la compatibilité avec IE6 ET IE7 en faite le sur mozilla tout les bloc sans a leur place mais quand je vis sur IE les blocs disparu ou et ils ne sont plus a leur place voila le lien pour voir http://lorractu.idev-hosting.info/ pour les feuille de style c'est main.css voila le code
Tu pourrais au moins te relire ...
merci mais pour le moment c'est pas ce qui va résoudre mon problème? |
|
Posté le 12/01/2008 à 21:02 |
Astucien | Désolé, pour ma part j'ai choisi de ne pas installer IE7. |
|
Posté le 12/01/2008 à 21:26 |
Maître astucien | Malcolm a écrit :
Désolé, pour ma part j'ai choisi de ne pas installer IE7.
Et moi , je peux pas l'installer !!! M'en fout , j'ai FF et Opera |
|
Posté le 12/01/2008 à 22:02 |
Petit astucien
| c'est bien mais c'est domage pour les autre et pour moi aussi car j'ai pas de reponse |
|