Bonjour

voilà j'ai plusieurs problème sur ce site (je débute hein):

1. le menu déroulant s'affiche bien sur ff, mais pas sur ie
2. les éléments de la colonne de gauche ne s'insèrent pas dans leurs cadres (sauf sur ie !!), pourtant je les ai mis dans des <p> eux mêmes insérés dans un <div>
3. la colonne de droite est repoussée loin à droite sur ie

Voici l'url du projet (mais il y a une image de pub dessus que j'ai récupéré pour l'exemple, j'espère que ce n'est pas grave)

http://www.malt77.com/crazy/index.php

voilà si quelqu'un pouvait m'aider......merci
Modifié par koala64 (25 Nov 2006 - 21:27)
mon code :

<body>
<div id="conteneur">
               <div id="header"><a href="index.php"></a></div>

	  <div id="gauche"><h1>membres</h1>
         <p id="membres">
          <form method="post" action="verif.php">
  <label for="user"></label>
  <input type="text" name="login" size="15" value="login">
  <br /> <br />
  <label for="pass"></label>
  <input type="text" name="pass" size="15" value="pass" background-color="#ffcc66">
  <br /> <br />
  <input type="image" src="./images/connexion.gif" width="110" height="26" border="0">
  </form>
          </p>
	  	<h1>newsletter</h1>
                  <p id="mail">
        </p>


	  </div>

	  <div id="droite"><p id="pubdroite"></p>
	  	<a href="calendrier2.php"><p id="calendrier"></p></a>
	  </div>

  	<div id="pubcentre">pub</div>
  	<div id="menuv">
	</div>
                 <div id="centre">
                 <p></p>
  	           </div>
	  
	  <div id="footer">event'scrazynight.com | contact | partenaires | publicité | nos engagements</div>

</div>


</body>
</html>


le css:

body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
margin: 0;
padding: 0;
background: url(images/10.gif) #000;
padding-left: 10%;
padding-bottom: 10px;
}
#header {
height: 162px;
background: url(images/ban.gif) no-repeat;
margin-top: 0px;
margin-bottom: 20px;
border-bottom: 2px solid white;
}
#conteneur {
position: absolute;
margin-top: 10px;
margin-bottom: 10px;
margin-left: 10px;
width: 1080px;
background-color:#d39135;
border: 1px outset black;
}
#centre {
background: url(images/images/centre_02.gif) #ffcc66;
margin-left: 230px;
margin-right: 230px;
}
#centre p
{
margin-left: 220px;
font-family: Microsoft Sans Serif;
  text-align: left;
  font-size: 0.9em;
  letter-spacing: 0.1em;
  font-weight: bold;
}
#gauche {
position: absolute;
left:0;
width: 200px;
}
#droite {
position: absolute;
right:0;
width: 200px;
}
#pubcentre
{
height: 80px;
background: #000;
margin-left: 215px;
margin-right: 215px;
padding-right: 0;
}
#footer {
padding-top: 12px;
clear: both;
height: 30px;
background-color: #000;
color: #fff;
text-align: center;
font-family: geneva;
}
.menugauche {
list-style-type: none;
margin: 0;
padding:0;
}
.menudroit {
list-style-type: none;
margin: 0;
padding:0;
}
h1
{
  background: url(images/titre.gif) no-repeat;
  padding-bottom: 0px;
  margin-left: 15px;
  margin-bottom: 0px;
  height: 30px;
  text-align: center;
  font-size: 1.2em;
  font-family: Helvetica ;
  font-weight: bold;
}
p#membres {
padding-top: 10px;
margin-left: 15px;
margin-top: 0px;
height: 130px;
background: url(images/cadre.gif) no-repeat;
text-align: center;

}
p#mail {
padding-top: 0px;
margin-left: 15px;
margin-top: 0px;
background: url(images/cadre.gif) no-repeat;
height: 250px;
}
p#pubdroite
{
background: url(images/pub1.gif) no-repeat;
margin-left: 25px;
height: 600px;
}
p#calendrier
{
background: url(images/calendrier.gif) no-repeat;
height: 200px;
margin-left: 30px;
}
Modérateur
Rebonjour, Smiley ravi

Dans le css pour ton menu, il y a indiqué :
li ul
{
  display:none;
}
li:hover>ul
{
  display: block;
}
Sous IE6, li:hover>ul ne fonctionne pas (la pseudo-classe hover ne s'applique qu'à l'élément a sur ce navigateur) et celui-ci n'interprète que li ul donc le menu ne peut pas apparaître... Il faudrait que ce soit le javascript qui lance la commande de masquage des listes du menu au démarrage.

Par ailleurs, il serait préférable d'ajouter les images placées en background sur les liens d'ouverture de ton menu en dur dans la partie xhtml sans oublier le alt afin qu'une fois les images et css désactivés, on puisse voir ces liens.

Pour ton formulaire, tu peux remplacer :
<h1>membres</h1>
<p id="membres">
	<form method="post" action="verif.php">
		<label for="user"></label>
		<input type="text" name="login" size="15" value="login">
		<br /> <br />
		<label for="pass"></label>
		<input type="text" name="pass" size="15" value="pass" background-color="#ffcc66">
		<br /> <br />
		<input type="image" src="./images/connexion.gif" width="110" height="26" border="0">
	</form>
</p>
par :
<h1>membres</h1>
<form id="membres" action="verif.php" method="post">
	<div>
		<label for="user">Utilisateur : </label>
		<input type="text" id="user" name="login" size="15" value="login" />
		<label for="pass">Mot de passe : </label>
		<input type="text" id="pass" name="pass" size="15" value="pass" />
	</div>
	<div>
		<input type="image" src="./images/connexion.gif" width="110" height="26" alt="Connexion" />
	</div>
</form>
et :
<h1>newsletter</h1>
<p id="mail">
	<form action='mail.php' method='post'>
		<input type='text' name='email' size='15'>
		<input type='submit' value='ok'>
	</form>
</p>
par :
<h1>newsletter</h1>
<form id="mail" action="mail.php" method="post">
	<div>
		<label for=="email">email</label>
		<input type="text" id="email" name="email" size="15" />
	</div>
	<div>
		<input type="submit" value="ok" />
	</div>
</form>
L'indication du label est utile... En cliquant dessus, on donne le focus au champ. Si tu ne les renseignes pas, ce n'est pas possible.
Les attributs s'indiquent à l'aide de guillemets et non d'apostrophes.
Il faut aussi bien fermer tes balises (input) et indiquer un attribut alt sur ton bouton de type "image".

Pour ceci :
<div id="droite">
	<p id="pubdroite"></p>
	<a href="calendrier2.php"><p id="calendrier"></p></a>
</div>
ça ne colle pas... Encore une fois, l'image de la pub devrait être placée dans le code xhtml et non en background.
a est un élément de type "en-ligne" et ne peut pas contenir d'élément de type "block" tel que p.

Avant de chercher à corriger tous tes problèmes, je pense que tu devrais commencer par rendre ta page valide, ce qui évitera un bon nombre d'erreurs de comportements... Smiley cligne
Modifié par koala64 (25 Nov 2006 - 22:39)