5568 sujets

Sémantique web et HTML

[Résolu] Problème d'espacement

Voilà je viens de passer au XHTML, c'est le grand saut mais.. J'ai comme qui dirait un problème d'espacement que je n'arrive pas à résoudre..

http://sheika82.free.fr/v2/accueil.html

J'aimerai réduire les espacements entre le header et mon menu horizontal + entre mon menu horizontal et mon contenu...

Ma CSS :
body
{
   width: 685px;
   margin: auto;
   background-color:#7bcadd;
}

#header
{  
   width: 685px;
   height: 202px;
   background-image: url("design/header1.jpg");
   background-repeat: no-repeat;
}

#bandeau
{
   margin-top: 0px;
   margin-bottom: 0px;
   width: 700px;
   height: 29px;
}


table
{   
   border-collapse: collapse; /* Les bordures du tableau seront collées (plus joli) */
   padding: 0px;
   margin: 0px;
}

td
{
   padding: 0px;
   margin: 0px;
}

#colonne1
{
   width: 176px;
   float:left;
   margin-top: 0px;
}
#colonne2
{
   width: 450px;
   margin-left: 176px;
   margin-top: 0px;
}

#menu
{
   background-image:url("design/background01.jpg");
   width: 685px;
   margin-top: 0px;
}

img
{
border:none;
}

#pied_de_page
{
   background-color: #626262;
}


Le XHTML :


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
   <head>
       <title>Bienvenue sur mon site !</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
       <link rel="stylesheet" media="screen" type="text/css" title="Exemple" href="style.css" />
   </head>
   <body>

<div id="header"></div>

<div id="bandeau"><table>
 <tr>
  <td><p><img src="design/bandeau1.jpg" alt="Bandeau1" /></p></td>
  <td><p><a href=""><img src="design/bandeau2.jpg" alt="Bandeau2" /></a></p></td>
  <td><p><a href=""><img src="design/bandeau3.jpg" alt="Bandeau3" /></a></p></td>
  <td><p><a href=""><img src="design/bandeau4.jpg" alt="Bandeau4" /></a></p></td>
  <td><p><a href=""><img src="design/bandeau5.jpg" alt="Bandeau5" /></a></p></td>
  <td><a href=""><img src="design/bandeau6.jpg" alt="Bandeau6" /></p></td>
 </tr></table></div>

<div id="menu">
  <div id="colonne1">
<ul>
<li>Lien1</li>
<li>Lien2</li>
<li>Lien3</li>
<li>Lien4</li>
<li>Lien5</li>
<li>Lien6</li>

<li>Lien7</li>
<li>Lien8</li>
</ul>

  </div>

  <div id="colonne2">
<h1>Mon super site</h1>

   <p>
       Bienvenue sur mon super site !<br />

       Vous allez adorer ici, c'est un site génial qui va parler de... heu... Je cherche encore un peu le thème de mon site  [lol]
   </p>

   <h2>A qui s'adresse ce site ?</h2>    
   <p>
       A tout le monde ! Si je commence à privilégier certaines personnes, on va m'accuser de discrimination;o)<br />
       Que vous soyez fans de fusils à pulsion plasma ou de Barbie et Ken, ce site est fait pour vous ! Si si !
   </p>
   
   <h2>L'auteur</h2>    
   <p>

       L'auteur du site ? Bah, c'est moi, quelle question :-p<br />
       Je vais essayer de faire le meilleur site du monde (ça doit pas être bien compliqué). Mon objectif est d'attirer un maximum de visiteurs, de les rendre accros à mon site, puis de les mettre en mon pouvoir.<br />
       Je prendrai ensuite le contrôle du Monde. Une fois que ce sera fait, j'irai explorer les confins de l'Univers à la recherche de nouveaux peuples à soumettre à ma terrible puissance. MooUUuUuuUAhahHaaAhAAaaah !!! (rire diabolique).
   </p>
  </div>


</div>

<div id="pied_de_page">
   <!-- Enfin, on mettra en bas de la page le nom de l'auteur, un copyright... -->

<p>Copyright "Tout pourri Corporation" 2005, tous droits réservés</p>
</div>
       
   </body>
</html>


Bizarre bizarre..
Modifié par Sheika (21 Aug 2005 - 16:57)
Annule les marges et padding par defaut de tous les éléments en debut de CSS pour travailler sur des bases communes a tous les navigateurs et ne pas avoir de suprises de ce genre.

* {
margin:0;
padding: 0;
}
Administrateur
Sheika a écrit :
Ok merci mais j'ai réglé mon problème Smiley smile

Hello Smiley smile

N'hésite pas à le marquer comme [Résolu] si c'est le cas Smiley cligne
Sujet clos
Aller à