Bonsoir a tous,
Voila je suis en train d'écrir la feuille de style du futur site de mon asso et lorsque je fais un test sur Firefox mon contenu n'apparait pas alors sur IE oui.
Pour vous aider voici mes codes:
Pourtant je ne comprend pas je me suis inspiré de votre tuturiel crér un site en 5 etapes et ça ne fonctionne pas
Autres question:
Pourquoi lrosque je met la fonction float: right mon menu se trouve complètement inverssé ? Ex Accueil , Plan du site, forum deviens forum, plan du site, accueil. La seul solution minable que j'ai trouver c'est d'inversser mon menu sur ma page html pour obtenir le menu comme je le souhaite sur ma page une fois ma page en test...
Merci a tous pour votre aide
Modifié par worms30 (20 Sep 2008 - 01:39)
Voila je suis en train d'écrir la feuille de style du futur site de mon asso et lorsque je fais un test sur Firefox mon contenu n'apparait pas alors sur IE oui.
Pour vous aider voici mes codes:
<!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>
<title>Création d'un design étape par étape - Etape n°1 : Le code xhtml</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-15" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<link rel="stylesheet" type="text/css" media="screen" href="style.css" />
<meta http-equiv="Content-Language" content="fr" />
</head>
<body>
<div id="conteneur">
<!-- MENU DE NAVIGATION GENERALE ------>
<ul id="menu">
<li><a href="index.html" title="Pages d'accueil">Accueil</a></li>
<li><a href="forum.html" title="Rejoignez nous sur le forum">Forum</a></li>
<li><a href="plandusite.html" title="plant du site">Plan du site</a></li>
<li><a href="contact.html" title="Contactez nous">Contact</a></li>
</ul>
<!-- ENTETE --------------------------->
<h1 id="header"><a href="http://www.planetlibre.org" title="c'est facile"><span>Planetlibre</span></a></h1>
<!--NAVIGATION ------------------------>
<div id="navigation">
<ul id="navigation">
<li id="active"><a href="#" id="current">Acceuil</a></li>
<li><a href="#">Protection de la nature</a></li>
<li><a href="#">Les conseilles écolo</a></li>
<li><a href="#">OGM</a></li>
<li><a href="#">Evennements</a></li>
<li><a href="#">Médias</a></li>
<li><a href="#">Nos actions</a></li>
<li><a href="#">Les membres</a></li>
<li><a href="#">Ma traces écologique</a></li>
</ul>
</div>
<!-- CONTENU DU SITE ------------------>
<div id="contenu">
<h2>Planet libre [lol]</h2>
<p>Fondée en septembre 2008 et régie par la Loi de 1901, ".........." est une association à but environnemental visent à l'entretien des espaces naturels, à la sensibilisation à l'environnement aupres de public scolarisé mais aussi de famille et de favoriser l'émergence d'éco-citoyens aux gestes du quotiens. <a href="Référencement.html">Référencement</a></p></p>
</div>
<!-- PIED DE PAGE --------------------->
<p id="piedpage">Copyright © - Planetlibre-Sep2008 <a href="plan">Plan du site</a><a href="contact">Contact</a><a href="Partenaire.html">Partenaires</a><a href="Référencement.html">Référencement</a></p>
</div>
</body>
</html>
body{
margin: 0 ;
padding: 0 ;
text-align: center ;
font: 0.8em "Trebuchet MS", helvetica, sans-serif ;
background: #5f3232 ;
}
div#conteneur{
width: 80% ;
margin: 0 auto ;
text-align: left ;
border: 2px solid #ab4 ;
background: #fff ;
}
h1#header{
height: 150px ;
}
div#contenu{
padding: 0 30px 0 100px ;
background: url(bg_page.gif) no-repeat 15px 15px ;
}
div#contenu h2{
padding-left: 25px ;
line-height: 25px ;
font-size: 1.4em ;
color: #9b2 ;
border-bottom: 1px solid #9b2 ;
}
div#contenu h3{
margin-left: 15px ;
padding-left: 5px ;
border-bottom: 1px solid #9b2 ;
border-left: 3px solid #9b2 ;
color: #9b2 ;
}
div#contenu p{
text-align: justify ;
text-indent: 2em ;
line-height: 1.7em ;
}
div#contenu a{
color: #8a0 ;
}
div#contenu a:hover{
color: #9b2;
}
p#piedpage{
margin: 0 ;
padding-right: 10px ;
line-height: 30px ;
text-align: right ;
color: #8a0 ;
}
ul#menu{
height: 35px ;
margin: 0 ;
padding: 0 ;
background: url(bg_menu.gif) repeat-x 0 -25px ;
list-style-type: none ;
}
ul#menu li{
float: right ;
text-align: left ;
}
ul#menu li a{
width: 130px ;
word-spacing: 2px;
margin-right: 8px;
line-height: 25px ;
font-size: 0.8em ;
font-weight: bold ;
letter-spacing: 2px ;
color: #ab4 ;
text-decoration: none ;}
ul#menu li a:hover
{
background: url(bg_menu.gif) repeat-x 0 0 ;
}
Pourtant je ne comprend pas je me suis inspiré de votre tuturiel crér un site en 5 etapes et ça ne fonctionne pas
Autres question:
Pourquoi lrosque je met la fonction float: right mon menu se trouve complètement inverssé ? Ex Accueil , Plan du site, forum deviens forum, plan du site, accueil. La seul solution minable que j'ai trouver c'est d'inversser mon menu sur ma page html pour obtenir le menu comme je le souhaite sur ma page une fois ma page en test...
Merci a tous pour votre aide
Modifié par worms30 (20 Sep 2008 - 01:39)