Tom's Guide > Forum > Programmation > Le menu à droite fait beuger

Le menu à droite fait beuger

Forum Programmation : Le menu à droite fait beuger

TomsGuide.com : 800 000 inscrits répondent à toutes vos questions high-tech et informatique. Pour obtenir de l'aide, inscrivez-vous gratuitement !

Créer un nouveau sujet Répondre

Bas de page Chercher dans ce sujet

Bonjour, mon menu à droite fait beuger tout mon code!

Voici mon code html:

Code :

<!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>Index</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="css" href="css.css" />
</head>
<body>
<div id="en_tete">
<center>
<img src="images/header.gif" />
</center>
</div>
<div id="menu_gauche">
<div class="element_menu">
<img src="images/general.jpg" alt="General" />
<ul>
<li><a href="index.php">Index</a></li>
<li><a href="contact.php">Contact</a></li>
<li><a href="dons.php">Dons</a></li>
<li><a href="partenaires">Partenaires</a></li>
</ul>
</div>
<div class="element_menu">
<img src="images/videos.jpg" alt="Videos" />
<ul>
<li><a href="videosautomoto.php">Auto-moto</a></li>
<li><a href="videosbagarres.php">Bagarres</a></li>
<li><a href="videosinclassables.php">Inclassables</a></li>
<li><a href="videosparodies.php">Parodies</a></li>
<li><a href="videosperformances.php">Performances</a></li>
<li><a href="videossport.php">Sport</a></li>
</ul>
</div>
<div class="element_menu">
<img src="images/flash.jpg" alt="Flash" />
<br />
<br />
<img src="images/animations.jpg" alt="Animations" />
<ul>
<li><a href="animsflashcombats.php">Combats</a></li>
<li><a href="animsflashcourses.php">Courses</a></li>
<li><a href="animsflashdivers.php">Divers</a></li>
<li><a href="animsflashtir.php">Tir</a></li>
</ul>
<img src="images/jeux.jpg" alt="Jeux" />
<ul>
<li><a href="jeuxflashaction.php">Action</a></li>
<li><a href="jeuxflashcombats.php">Combats</a></li>
<li><a href="jeuxflashcourses.php">Courses</a></li>
<li><a href="jeuxflashdivers.php">Divers</a></li>
<li><a href="jeuxflashsport.php">Sport</a></li>
<li><a href="jeuxflashtir.php">Tir</a></li>
</ul>
</div>
</div>
<div id="menu_droite">
<div class="element_menu">
<img src="images/pubs.jpg" alt="Pubs" />
<ul>
<table width="120" border="0" cellspacing="0" cellpadding="0"><tr><td align="center"><a href="http://www.lebest.fr/?id=24922" title="videos humoristiques"><img src="http://www.lebest.fr/banniere.php?id=24922&format=120_60" alt="videos humoristiques" width="120" height="60" border="0"></a></td></tr><tr><td align="center"><a href="http://www.lebest.fr" title="videos humoristiques"><span style="font-family: arial; font-size: 10px;">videos humoristiques</span></a></td></tr></table>
<script type="text/javascript">
google_ad_client = "pub-6942935157941398";
google_ad_width = 180;
google_ad_height = 90;
google_ad_format = "180x90_0ads_al";
google_ad_channel = "";
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</ul>
</div>
<div id="corps">
</div>
<div id="pied_de_page">
<br>
<a href="index.php">Index</a> | <a href="contact.php">Contact</a> | <a href="conseillersite.php">Conseiller Ce Site</a> | <a href="liens.php">Liens</a> | <a href="votrebannieresite.php">Votre Bannière Sur Ce site</a> | <a href="partenaires.php">Partenaires</a>
<center>Design © 2007 pour web-media</center>
<br />
<div align="center"><span class="copyright"><br>TOUS DROITS RESERVES<font color="#ff0000"> web-media</font> © 2007 <font color=#ff0000>http://web-media.exen.fr</font><br></span></div>
<a href="http://www.xiti.com/xiti.asp?s=308426" title="WebAnalytics">
<script type="text/javascript">
<!--
Xt_param = 's=308426&p=';
try {Xt_r = top.document.referrer;}
catch(e) {Xt_r = document.referrer; }
Xt_h = new Date();
Xt_i = '<img width="39" height="25" border="0" alt="" ';
Xt_i += 'src="http://logv16.xiti.com/hit.xiti?'+Xt_param;
Xt_i += '&hl='+Xt_h.getHours()+'x'+Xt_h.getMinutes()+'x'+Xt_h.getSeconds();
if(parseFloat(navigator.appVersion)>=4)
{Xt_s=screen;Xt_i+='&r='+Xt_s.width+'x'+Xt_s.height+'x'+Xt_s.pixelDepth+'x'+Xt_s.colorDepth;}
document.write(Xt_i+'&ref='+Xt_r.replace(/[<>"]/g, '').replace(/&/g, '$')+'" title="Internet Audience">');
//-->
</script>
<noscript>
Mesure d'audience ROI statistique webanalytics par <img width="39" height="25" src="http://logv16.xiti.com/hit.xiti?s=308426&p=" alt="WebAnalytics">
</noscript></a>
<script type="text/javascript"><!--
google_ad_client = "pub-6942935157941398";
google_ad_width = 120;
google_ad_height = 60;
google_ad_format = "120x60_as_rimg";
google_cpa_choice = "CAAQnO3DmwIaCOt0rER_hDgEKMyuuosBMAA";
google_ad_channel = "";
//-->
</script>
<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>
</body>
</html>
<

et mon code css:

Code :

body
{
padding: 10px;
margin: auto;
margin-top: 20px;
margin-bottom: 20px;
background-color: #00CCFF;
}
/* Le menu */
#menu_gauche
{
float: left; /* Le menu flottera à gauche */
width: 130px; /* Très important : donner une taille au menu */
}
#menu_droite
{
float: right; /* Le menu flottera à droite */
width: 130px; /* donner une taille au menu */
}
.element_menu
{
background-color: #FFFFFF;
background-repeat: repeat-x;
border: 2px solid black;
margin-bottom: 20px; /* Pour éviter que les éléments du menu ne soient trop collés */
}
.element_menu ul /* Toutes les listes à puces se trouvant dans un menu */
{
padding: 0px; /* Tous les côtés ont une marge intérieure de 0 pixels */
padding-left: 20px; /* ... mais on modifie ensuite la marge de gauche, donc celle-là fera finalement 20 pixels */
margin: 0px; /* Idem pour margin, ça nous évite d'avoir à en écrire 4 (margin-left, margin-right...) */
margin-bottom: 5px; /* Même chose que tout à l'heure, on modifie ensuite juste margin-bottom, mais tous les autres sont à 0px */
}
.element_menu a /* Tous les liens se trouvant dans un menu */
{
color: #00CCFF;
}
.element_menu a:hover /* Quand on pointe sur un lien du menu */
{
color: #000000 ;
}
#corps
{
margin-left: 140px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
margin-right: 140px;
margin-bottom: 20px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
padding: 5px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
color: #000000;
background-color: #FFFFFF; /* Une couleur de fond pour le corps */
border: 2px solid black; /* Une bordure pour bien marquer les limites du corps et pour faire joli */
}
#pied_de_page
{
margin-left: 10% /* Et oui les pourcentages ça sert partout.*/
width: 80%; /* Réduction de la largeur du footer.*/
padding: 5px;
text-align: center;
color: #000000;
background-color: #FFFFFF;
border: 2px solid black;
}

Merci d'avance

Message édité par flo354 le 16-05-2007 à 19:30:56

Répondre

Inscrivez-vous ou connectez-vous pour masquer ceci.

Personne?

Répondre à flo354

attends, je vais chercher ma boule de cristal ...

Répondre à okinou

Bonjour,
je te conseille d'utiliser des tableaux pour la mise en forme de ton site qui est peut etre plus compliquer au debut mais qui donne un resultat bien meilleur a l'arrive je pense

Sinon pour ton menu la je voit pas ce que tu entend par "fait beuger tout mon code!", si tu pouvais etre plus precis ca serait interssant

@+
bon courage

------------------------------ La parole est d'argent mais le silence est d'or
Répondre à DivX_666

J'y suis presque arrivé la! il me reste plus qu'un dernier petit beug et voilà

Répondre à flo354

Citation :

je te conseille d'utiliser des tableaux pour la mise en forme de ton site qui est peut etre plus compliquer au debut mais qui donne un resultat bien meilleur a l'arrive je pense

Conseiller de malheurs !! Ne l'encourage pas à utiliser les tableaux. Pour le design ce sont les Div qui sont faites pour ça. Bien trop d'amateuir prenne l'habitude d'utiliser des tableux et ne peuvent plus s'en défaire. L'utilisation des div permette une adaptation à plusieurs CSS (notamment pour les mal voyant); Ainsi, avec des div vous pouvez faire deux sites ayant le même contenu mais pas du tout le même design en changeant juste la feuille CSS.

C'est porquoi flo354 je t'incite à laisser ton code en div, le travail est plus fastidieux mais face à des pros ça payera crois moi !

Répondre à phplayer

Alor on peut egalement changer le design entierement san toucher au tableau, juste en changeant le css . . . .
Donc avant de critiquer on se renseigne
@+

------------------------------ La parole est d'argent mais le silence est d'or
Répondre à DivX_666

les deux marche trés bien et sont + ou - adapté a un site

Répondre à proairgun

Voila une reflexion intelligente qui met tout le monde d'accord

------------------------------ La parole est d'argent mais le silence est d'or
Répondre à DivX_666

non, non je ne suis pas démagogue :lol:

Répondre à proairgun

Je détest les tableaux, j'avais fait un design avec et j'en était dégouté sa faisait tout beuger.
au fait je suis arrivé a corriger les beugs voici mon site:

http://web-media.exen.fr

Répondre à flo354

http://www.cybercodeur.net/weblog/ [...] thing.html
là vous trouverez pourquoi les tableaux HTML utilisés pour la mise en forme sont mal ! Amusez-vous bien

Répondre à AjJi@IDN

Créer un nouveau sujet Répondre

Tom's Guide > Forum > Programmation > Le menu à droite fait beuger

Aller à :

Aide |
Règles du forum

Il y a 2316 utilisateurs connus et inconnus. Pour voir la liste des connectés connus, cliquez ici.

Page générée en 0,622 secondes

Attention

Vous allez répondre sur un sujet resté inactif pendant plus de 6 mois.
Assurez-vous d'apporter des éléments nouveaux à la discussion avant de poursuivre.

Répondre Annuler

Liens