Mon CSS Bug ? Est-ce le Javascript ? Je comprends pas !

Question

K0zoo

28 Nov 2007 à 21:26

Bonsoir à tous et à toutes !
Donc voilà mon problème qui date un peu là...

Voilà donc mon problème. Je refais mon site et pis j'ai déjà fais tout le design, le menu en javascprit.
Mai que je veux regler le futur contenu, il y a des choses assez génante.

Enfaite, dans la div contenu, si on peut l'appeler comme ça, je met mon texte et quand j'observe le résultat c'est pas terrible, je met un margin sur les cotés de px, c'est déjà mieux, mais il y a des bug au niveau du menu, quand je survole mon menu, le texte bouge, je vois pas pourquoi...

Voici mes codes :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Exemple" href="css.css" />
<title>Document sans nom</title>
<?php
include("javascript.php");
?>
</head>
 
<body>
<?php
include("header.php");
?>
 
<div id="site">
 
<?php
include("menu.php");
?>
 
 <div id="corps">
 
   <h1>Les Bijuus et jinchuurikis :</h1>
 
 
  Kyubi mode "une queue" apparaît pour la première fois dans le combat opposant Sasuke à Naruto, à la fin de la première partie du manga. Les différents pouvoirs que Naruto possède sous cette forme sont une guérison encore plus rapide, plus de vitesse, de puissance. L'aura qui l'entoure prend la forme du démon renard, et agit à part. Ce qui veut dire que la partie de l'aura qui se trouve autour de la main de Naruto peut attaquer indépendamment l'adversaire ainsi que sa queue.</p>
 
 
</div>
<div id="copyright">Naruto RPG // Manga by Masashi Kishimoto © 2007-2008 | Design réalisé par N44PS et K0zoo</div>
</body>
</html>

p{
   font-family:Verdana, Arial, Helvetica, sans-serif;
   font-size:10px;
   color:#666666;
   max-width:750px;
}
 
h1
{
   color:#999999;
   font-size:12px;
   font-family:Verdana, Arial, Helvetica, sans-serif;
}
 
.img
{
   border:solid 1px grey;
   background-color:#E5E5E5;
   padding:3px;
}
body
{
   margin:0px;
   background-color:#93959D;
   background-repeat:repeat;
}
 
#site
{
   width:850px;
   min-height:1000px;
   height:auto;
   background-image:url(fond.png);
   background-repeat:repeat-y;
   margin:auto;
}
 
#corps
{
   position:absolute;
   z-index:10;
   padding-left:50px;
   padding-right:50px;
   width:850px;
   height:auto;
   padding-top:20px;
   }
   
#header
{
   background-image:url(header.jpg);
   width:850px;
   height:200px;
   margin:auto;
}  
 
#menudroite
{
   width:164px;
   height:800px;
   background-image:url(fonddroite.jpg);
   background-repeat:repeat-y;
   padding:0px;
   margin:0px;
   float:right;
}
 
#bande
{
   height:920px;
   width:164px;
   margin-top:35px;
   margin-right:30px;
   float:right;
   z-index:10;
   background-image:url(fonddroite.jpg);
   background-repeat:repeat-y;
   
}
 
#release
{
   background-image:url(release.jpg);
   width:164px;
   height:19px;
   background-repeat:no-repeat;
}
   
   
#tome
{
   background-image:url(tome.jpg);
   width:164px;
   height:19px;
   background-repeat:no-repeat;
}
   
   
#tchat
{
   background-image:url(tchat.jpg);
   width:164px;
   height:19px;
   background-repeat:no-repeat;
}
   
#partenaire
{
   background-image:url(partenaire.jpg);
   width:164px;
   height:19px;
   background-repeat:no-repeat;
}
 
#stats
{
   background-image:url(stats.jpg);
   width:164px;
   height:19px;
   background-repeat:no-repeat;
}
   
#copyright
{
   text-align:center;
   font-family:Verdana, Arial, Helvetica, sans-serif;
   font-size:10px;
   background-image:url(fond.png);
   background-repeat:repeat-y;
   width:850px;
   z-index:11;
}
 
dl, dt, dd, ul, li {
margin: 0px;
padding: 0px;
list-style-type: none;
width:100px;
 
}
#menu {
width:850px;
height:30px;
background-image:url(menufond.jpg);
z-index:20;
position:absolute;
}
 
#menu dl {
float: left;
width: 100px;
margin-left:5px;
}
 
#menu dt {
cursor: pointer;
height:30px;
width:100px;
 
 
}
#menu dd {
background-color: #a9b8cb;
}
 
#menu li {
text-align: center;
background-color:#AAB6C9;
}
 
#menu li a, #menu dt a {
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
}
 
#menu img
{
   padding:0px;
   margin:0px;}
   
#menu li a:hover, #menu dt a:hover {
background: #C5C9E2;
}
 
#menu a {
text-decoration: none;
font-size:10px;
font-family:Verdana, Arial, Helvetica, sans-serif;
color:#333333;
}
 
#bouton
{
   margin-left:55px;
   width:850px;
   height:30px;
}

Ensuite, mon Javascript est le même que celui du tuto pour menu déroulant horizontale :

<script type="text/javascript">
<!--
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
        for (var i = 1; i<=10; i++) {
                if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
        }
if (d) {d.style.display='block';}
}
//-->
</script>

J'ai pas hésité à mettre pratiquement tout parceque je ne sais pas d'où ça peut provenir. Merci de votre aide, bonne soirée Smiley murf

K0zoo

30 Nov 2007 à 05:49

Quelqu'un pourrait m'aider ? Smiley confused