[xHTML/CSS]Probleme - espace blanc

Résolu/Fermé
Utilisateur anonyme - 9 janv. 2009 à 00:42
 Utilisateur anonyme - 9 janv. 2009 à 00:53
Bonjour,

Je m'occupe de programmer en HTML/CSS , le site de ma team.
Je viens de fini d'apprendre et j'ai mis en application tous ce que j'ai appris mais un problème que je n'arrive pas à résoudre survient.
Dans une <table> ou j'ai rentré du code valide... j'ai un espace qui viens poussé mon texte vers le bas.
J'ai essayé le code CSS padding:0 ;margin:0 ; en vain...
Peut-être que je le place mal ou ce n'est peut-être pas le bon code.
Pourriez vous m'aidez ?
Voici la page en question : https://teambot.forum2jeux.com/ (allé en bas a gauche de la page , la rubrique s'appelle "Membres connectés".)
Voici une partie du code que j'ai tapé :
<div class="element_menu">
   <h3><u>Connect&eacute;s</u></h3>
 <table width="200">
  <tr>
   <td width="123"><img src="http://www.stpm-montpellier.fr/image/drapeau_france.jpg">    <a href="https://team-pr.1fr1.net/#fiche_sphinx088" title="Cliquez-ici pour voir la fiche de ce joueur"><font face="Comic Sans MS" size="1"><span style="color: #610FB5;">[PrV]sphinx_088</font></span></a></td>
   <td width="141"><!--
    Skype 'Mon statut' button
    http://www.skype.com/go/skypebuttons
    -->
   <script type="text/javascript" src="http://www.isclan.fr/modules/skype/skypeCheck.js"></script>
   <a href="skype:sphinx_088?call"><img id="connect" src="http://mystatus.skype.com/mediumicon/sphinx_088" style="border: none; float:right; " width="20" height="20" alt="Mon statut" /></a>
   </td>
   </tr>
  </td>
   </tr>
   </table>
   </div>
   </div>


et le CSS:

  body
{
   width: 760px;
   margin: auto; /* Pour centrer notre page */
   margin-top: 20px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour voir ! */
   margin-bottom: 20px;    /* Idem pour le bas du navigateur */
   background-image: url("images/fond.png"); /* Une petite image de fond pour éviter d'avoir un vieux fond blanc :p */
}

#en_tete
{
   width: 760px;
   height: 100px;
   background-image: url("");
   background-repeat: no-repeat;
   margin-bottom: 10px;
}

#menu
{
   float: left;
   width: 210px;
}

.element_menu
{
   background-color: #FFFFFF;
   background-image: url("images/motif.png");
   background-repeat: repeat-x;
   
   border: 2px solid red;
   
   margin-bottom: 20px;
   
}


/* Quelques effets sur les menus */


.element_menu h3 /* Tous les titres de menus */
{    
   color: #CE0000;
   font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
   text-align: center;
}

.element_menu ul /* Toutes les listes à puces se trouvant dans un menu */
{
   list-style-image: url("images/puce.png"); /* On change l'apparence des puces */
   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: #CE0000;
}

.element_menu a:hover /* Quand on pointe sur un lien du menu */
{
   background-color: #000000;
   color: red;
}

#corps
{
   margin-left: 230px; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
   margin-bottom: 20px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
   padding: 10px; /* 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 */
   background-image: url("images/motif.png");
   background-repeat: repeat-x; /* Une petite image de fond qui se répètera horizontalement en haut */
   
   border: 2px solid red; /* Une bordure pour bien marquer les limites du corps et pour faire joli */
}

#corps h1 /* Tous les titres h1 du corps */
{
   color: #B3B3B3;
   text-align: center;
   font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
}

#corps h2 /* Tous les titres h2 du corps */
{
   height: 30px;

   background-image: url("http://www.my-upload.fr/getfile.php?file_id=269&file_key=nlhnw"); /* Une petite image de fond sur les titres h2 */
   background-repeat: no-repeat; /* L'image ne se répètera pas, elle sera à gauche du titre */
   
   padding-left: 55px;
   color: #B3B3B3;
   text-align: left;
}


Merci de m'aider.

3 réponses

RAD ZONE Messages postés 5224 Date d'inscription samedi 20 janvier 2007 Statut Contributeur Dernière intervention 22 mars 2024 1 353
9 janv. 2009 à 00:47
et tout ces <br> ils viennent d ou ??

 <font face="Comic Sans MS">   </font><h3><font face="Comic Sans MS"><u>Connectés</u></font></h3>
<font face="Comic Sans MS"> <br>
    <br>
   <br>
   <br>
   <br>
   
   <br>

   <br>
   
   <br>
   
   <br>
   <br>
   <br>
   
   <br>
   
   <br>
   
   <br>
   
   <br>

   
   <table align="top" width="200">
  <tbody><tr>
   <td width="123"><img src="http://www.stpm-montpellier.fr/image/drapeau_france.jpg">    <a href="https://team-pr.1fr1.net/#fiche_sphinx088" title="Cliquez-ici pour voir la fiche de ce joueur"><font size="1" face="Comic Sans MS"><span style="color: rgb(97, 15, 181);">[PrV]sphinx_088</span></font></a></td>
   <td width="141"><!--
    Skype 'Mon statut' button
    http://www.skype.com/go/skypebuttons
    -->



3
zoby44 Messages postés 818 Date d'inscription vendredi 3 novembre 2006 Statut Membre Dernière intervention 7 avril 2010 199
9 janv. 2009 à 00:53
Salut, ça ne viens pas du CSS, entre ton div en_tete et ton '<font face="Comic Sans MS">' il y a plein de <br/> qui se baladent. A mon avis ça viens juste de la.
1
Utilisateur anonyme
9 janv. 2009 à 00:53
Erf ! MERCI BIEN !
0