Bonsoir, je viens de mettre sur mon site consacré à la F1 une boutique de vente de billet pour ce sport. En plus de ce sport, il va y avoir prochainement d'autre discipline comme la MotoGp, A1 GP, le WTCC etc etc
J'ai donc voulut mettre un menu déroulant, etant une vraie chèvre en programmation html, je me suis dit que j'allais trouvé mon bonheur sur le net grace à google mais tout ce que j'ai trouvé, je n'ai pas réussit à l'intégrer à ma feuille de style css
De ce fait je viens vous demander si quelqu'un sait faire cela et s'il aurait la gentillesse de me le faire ou de m'expliquer comment je dois faire car je ne demande pas mieux que d'apprendre.
Voilà la partie de la feuille de style css qui gére le header
[cpp] /* Valeurs par default Applicables sur toute la page
--------------------------------------------------------------------------------------------------------*/
*{margin:0; padding:0; list-style:none;}
body{font:64% Arial, Helvetica, sans-serif; background:#DADADA; padding:45px 0 20px;}
a{text-decoration:none;color:#444;}
a:hover{color:#00a0fc;}
a img {border:0px none; }
h2{background:url('img/h2.jpg');height:34px;font-size:1.1em;text-align:right;position:relative;text-transform:uppercase;line-height:20px;font-family:Verdana;color:#2c5ab0; padding-left:0; padding-right:20px; padding-top:0; padding-bottom:0}
.tl{position:absolute;top:0;left:0;font-size:0}
.tr{position:absolute;top:0;right:0;font-size:0}
.clear{visibility:hidden;clear:both; min-height:1px}
/* Layout, Structure des Blocks
--------------------------------------------------------------------------------------------------------*/
#wrapper{width:1000px; margin: 0 auto}
#header{background:url('img/header.jpg');height:204px;margin-bottom:20px; position:relative}
#content{width:761px;float:right; padding:0 1px 20px 0;}
#sidebar{width:203px; padding-bottom:20px;}
#footer{background:url('img/footer.jpg') no-repeat;height:57px; clear:both; margin-top:20px}
/* Contenu
--------------------------------------------------------------------------------------------------------*/
/**** Header ****/
#header h1{position:absolute;width:420px;height:50px;left:250px;top:60px; font-size:0}
#header h1 a{display:block;width:100%;height:100%;text-indent:-5000px;}
#header ul#toolbar{position:absolute;top:176px;left:202px;}
#header ul#toolbar li{float:left;}
#header ul#toolbar li a{display:block;width:116px;line-height:23px;margin-right:2px; text-transform:uppercase; text-align:center;color:#e5edf4;font-weight:bold;font-family:Tahoma;font-size:1.1em; letter-spacing:1px;}
#header ul#toolbar li a:hover{color:#c1c1f4;}
#header ul#toolbar li form#searchengine input{border:0px none;background:none}
#header ul#toolbar li form#searchengine input#q{width:93px; font-size:1.1em;margin:6px 0 0 7px;}
#header ul#toolbar li form#searchengine input#sub1{width:12px;height:14px; font-size:0;margin:-4px 0 0; vertical-align: middle; cursorointer;}
[/cpp]
Et la programmation htlm du header
[cpp] <div id="header">
<h1><a href="http://www.maxif1.com">MaxiF1.com</a></h1>
<ul id="toolbar">
<li><a href="http://www.maxif1.com" title="Retour à l'accueil">accueil</a></li>
<li>
<a href="#" title="Prochainement sur Maxif1.com">billetterie</a>
</li>
<li><a href="http://www.maxif1.com/Forum" title="Communauté MaxiF1, discutez de la F1, et de tous les sports mécaniques">forum</a></li>
<li><a href="http://www.maxif1.com/Forum/annuaire.php" title="Annuaire des sports mécaniques">annuaire</a></li>
<li><a href="aff_contact.php" title="Contactez le Webmaster">contact</a></li>
<li>
<form id="searchengine" method="get" action="http://www.google.com/search" />
<p>
<input type="text" name="q" id="q" value="Rechercher" onclick="this.value=''" />
<input type="submit" id="sub1" value="" />
<input type="hidden" name="sitesearch" value="maxif1.com" />
</p>
</form>
</li>
</ul>
</div><!-- end #header -->[/cpp]
Il faudrait mettre le menu déroulant sur l'onglet billetterie
Merci de votre aide et de vos conseilles
J'ai donc voulut mettre un menu déroulant, etant une vraie chèvre en programmation html, je me suis dit que j'allais trouvé mon bonheur sur le net grace à google mais tout ce que j'ai trouvé, je n'ai pas réussit à l'intégrer à ma feuille de style css
De ce fait je viens vous demander si quelqu'un sait faire cela et s'il aurait la gentillesse de me le faire ou de m'expliquer comment je dois faire car je ne demande pas mieux que d'apprendre.
Voilà la partie de la feuille de style css qui gére le header
[cpp] /* Valeurs par default Applicables sur toute la page
--------------------------------------------------------------------------------------------------------*/
*{margin:0; padding:0; list-style:none;}
body{font:64% Arial, Helvetica, sans-serif; background:#DADADA; padding:45px 0 20px;}
a{text-decoration:none;color:#444;}
a:hover{color:#00a0fc;}
a img {border:0px none; }
h2{background:url('img/h2.jpg');height:34px;font-size:1.1em;text-align:right;position:relative;text-transform:uppercase;line-height:20px;font-family:Verdana;color:#2c5ab0; padding-left:0; padding-right:20px; padding-top:0; padding-bottom:0}
.tl{position:absolute;top:0;left:0;font-size:0}
.tr{position:absolute;top:0;right:0;font-size:0}
.clear{visibility:hidden;clear:both; min-height:1px}
/* Layout, Structure des Blocks
--------------------------------------------------------------------------------------------------------*/
#wrapper{width:1000px; margin: 0 auto}
#header{background:url('img/header.jpg');height:204px;margin-bottom:20px; position:relative}
#content{width:761px;float:right; padding:0 1px 20px 0;}
#sidebar{width:203px; padding-bottom:20px;}
#footer{background:url('img/footer.jpg') no-repeat;height:57px; clear:both; margin-top:20px}
/* Contenu
--------------------------------------------------------------------------------------------------------*/
/**** Header ****/
#header h1{position:absolute;width:420px;height:50px;left:250px;top:60px; font-size:0}
#header h1 a{display:block;width:100%;height:100%;text-indent:-5000px;}
#header ul#toolbar{position:absolute;top:176px;left:202px;}
#header ul#toolbar li{float:left;}
#header ul#toolbar li a{display:block;width:116px;line-height:23px;margin-right:2px; text-transform:uppercase; text-align:center;color:#e5edf4;font-weight:bold;font-family:Tahoma;font-size:1.1em; letter-spacing:1px;}
#header ul#toolbar li a:hover{color:#c1c1f4;}
#header ul#toolbar li form#searchengine input{border:0px none;background:none}
#header ul#toolbar li form#searchengine input#q{width:93px; font-size:1.1em;margin:6px 0 0 7px;}
#header ul#toolbar li form#searchengine input#sub1{width:12px;height:14px; font-size:0;margin:-4px 0 0; vertical-align: middle; cursorointer;}
[/cpp]
Et la programmation htlm du header
[cpp] <div id="header">
<h1><a href="http://www.maxif1.com">MaxiF1.com</a></h1>
<ul id="toolbar">
<li><a href="http://www.maxif1.com" title="Retour à l'accueil">accueil</a></li>
<li>
<a href="#" title="Prochainement sur Maxif1.com">billetterie</a>
</li>
<li><a href="http://www.maxif1.com/Forum" title="Communauté MaxiF1, discutez de la F1, et de tous les sports mécaniques">forum</a></li>
<li><a href="http://www.maxif1.com/Forum/annuaire.php" title="Annuaire des sports mécaniques">annuaire</a></li>
<li><a href="aff_contact.php" title="Contactez le Webmaster">contact</a></li>
<li>
<form id="searchengine" method="get" action="http://www.google.com/search" />
<p>
<input type="text" name="q" id="q" value="Rechercher" onclick="this.value=''" />
<input type="submit" id="sub1" value="" />
<input type="hidden" name="sitesearch" value="maxif1.com" />
</p>
</form>
</li>
</ul>
</div><!-- end #header -->[/cpp]
Il faudrait mettre le menu déroulant sur l'onglet billetterie
Merci de votre aide et de vos conseilles