[Résolu] Supprimer les marges d'un tableau

Bonsoir tout le monde !

J'ai un soucis au niveau d'un tableau. Des marges apparaissent et je voudrais les faire disparaître. Voilà le problème : http://www.metroid-master.com/test.php

J'ai créé un tableau pour mettre les différentes images qui constituent ma bannière pour mettre les liens sur les images (accueil, forum, etc.) puisque "map" n'ont pas l'air de fonctionner avec IE. Comme vous pouvez le voir, il y a des marges qui me dérangent et je n'arrive pas à les enlever. Voici mes codes HTML et CSS.

<div class="table_banniere"><table border="0" cellpadding="0" cellspacing="0" width="100%">
  <tr>
    <td align="center"><img src="http://www.metroid-master.com/images/banniere1_01.png" /></td></tr>
    <tr><td><img src="http://www.metroid-master.com/images/banniere1_02.png" /><a href="http://www.metroid-master.com/index.php"><img src="http://www.metroid-master.com/images/banniere1_03.png" border="0" /></a><a href="http://www.metroid-master.com/forum"><img src="http://www.metroid-master.com/images/banniere1_04.png" border="0" /></a><a href="http://www.metroid-master.com/index.php?section=contact"><img src="http://www.metroid-master.com/images/banniere1_05.png" border="0" /></a><a href="http://www.metroid-master.com/index.php?section=espace_membres&sub=inscription"><img src="http://www.metroid-master.com/images/banniere1_06.png" border="0" /></a><a href="http://www.nintendo-master.net"><img src="http://www.metroid-master.com/images/banniere1_07.png" border="0" /></a><img src="http://www.metroid-master.com/images/banniere1_08.png" /></td></tr>
    <tr><td><img src="http://www.metroid-master.com/images/banniere1_09.png" /></td></tr></table></div>

.table_banniere table
{
border-collapse: collapse;
}

Merci d'avance !
Modifié par MetroidMaster (01 Oct 2007 - 18:53)

Salut,

Avant de parler de quoi que ce soit, rend ta page valide.

346 erreurs à la validation W3C c'est très nettement perfectible.

Un fois ta page valide on verra.

Bon courage.

Salut,

Mouais, à ce niveau je sais pas comment m'y prendre, si on pouvait m'expliquer ce que ça changera pour moi lorsque ma page sera valide, ce serait bien

Edit : J'ai regardé les erreurs, et c'est que des "erreurs" de syntaxe. Parfois, ça me dit qu'il y a un > en trop ou je ne sais quoi alors que je vois pas où est l'erreur. Enfin, je pense pas que ça change quoi que ce soit au niveau de ma bannière...
Modifié par MetroidMaster (30 Sep 2007 - 22:29)

MetroidMaster a écrit :
Mouais, à ce niveau je sais pas comment m'y prendre, si on pouvait m'expliquer ce que ça changera pour moi lorsque ma page sera valide, ce serait bien

Ca change que chaque navigateur peut interpréter ce qu'il veut, la validité du code t'assure une certaine homogénéité de rendu entre les différents navigateurs. Avec des erreurs, ne t'étonnes pas d'avoir des différences fondamentales sur IE.

Oui, mais la seule différence que j'ai avec IE est que les liens de la bannière ne fonctionnent pas. Pour le reste, tout va bien.
Après, si vous voulez pas m'aider pour ce fichu tableau... -__-

Pas besoin d'un tableau surtout de la façon que tu t'en sert.

<div class="table_banniere">
<img src="http://www.metroid-master.com/images/banniere1_01.png" />
<img src="http://www.metroid-master.com/images/banniere1_02.png" />
<a href="http://www.metroid-master.com/index.php">
<img src="http://www.metroid-master.com/images/banniere1_03.png" border="0" /></a>
<a href="http://www.metroid-master.com/forum">
<img src="http://www.metroid-master.com/images/banniere1_04.png" border="0" /></a>
<a href="http://www.metroid-master.com/index.php?section=contact">
<img src="http://www.metroid-master.com/images/banniere1_05.png" border="0" /></a>
<a href="http://www.metroid-master.com/index.php?section=espace_membres&sub=inscription">
<img src="http://www.metroid-master.com/images/banniere1_06.png" border="0" /></a>
<a href="http://www.nintendo-master.net">
<img src="http://www.metroid-master.com/images/banniere1_07.png" border="0" /></a>
<img src="http://www.metroid-master.com/images/banniere1_08.png" />
<img src="http://www.metroid-master.com/images/banniere1_09.png" />
</div>

Et le style

.table_banniere {
width:765px;
}
.table_banniere img {
margin: -2px;
}

C'est pas la meilleur façon mais vu que tu semble ne pas vouloir coder de façon valide sa remplira la tâche.

MetroidMaster a écrit :
Pour le reste, tout va bien.

Ah bon ?

IE :


> cadre de l'espace membre coupé par le bas
> filet vertical blanc à l'extérieur droit du conteneur

FF / Netscape :


> décalage entre les images de la bannière, provoquant des coupures horizontales
> chevauchement du cadre espace membre et du titre news

Opera :


> sans commentaire... (je précise juste que l'affichage des images et bien actif !)
Modifié par Mikachu (30 Sep 2007 - 23:43)

Non mais... nous vivons dans un monde libre... si il veut faire un site mal programmé qui marche seulement comme il faut chez lui... c'est son droit..

Sa me rapelle mon adolescence ce genre de programmation.

gizz a écrit :
Non mais... nous vivons dans un monde libre... si il veut faire un site mal programmé qui marche seulement comme il faut chez lui... c'est son droit..

Sans aucun doute, mais il ne devra pas être étonné de tous les conseils que les membres vont lui donner sur ce forum, exclusivement dédié à la conception aux normes, non ?

Il faut parfois avoir l'ouverture d'esprit d'accepter les vrais conseils reçus et ne pas se focaliser sur un petit problème mineur... vite réglé quand la structure sera propre et conforme.
Modifié par Raphael (01 Oct 2007 - 08:31)

c'était légèrement sarcastique ma réponse... j'ai regadé son code et c'est n'importe quoi.

Revenons-en au sujet de ce post : son menu qui ne va pas bien :

@MetroidMaster : va faire un tour sur cette page.
Tu y trouveras une nouvelle méthode pour faire de jolis menus sans tableaux.

Pour le reste, ...

A+

gizz a écrit :
j'ai regadé son code et c'est n'importe quoi.

On peut aussi éviter de sortir directement les grands mots et essayer d'être plus pédagogue que juge du travail d'autrui, hein.

Mais il est vrai qu'il y a une forte marge de progression dans les domaines suivants:
- respect de la syntaxe HTML (validité du code);
- utilisation raisonnée de la sémantique d'HTML (raisonnablement limitée, donc ça n'est pas bien dur à mettre en place);
- accessibilité (notamment des contenus non textuels de l'interface).

Sur ce deux derniers points, voici ce que donne la page d'accueil du site (je néglige la page d'accueil à proprement parler, qui n'a pas de contenu, et repose sur un lien placé sur une image sans texte alternatif) si on remplace les images par leur texte alternatif:


Ça n'est pas complètement mauvais, mais il y aurait pas mal de choses à corriger, notamment le texte alternatif pour les images du menu de navigation, l'utilisation de titres de section pour les différents titres dans le menu de gauche, etc.


Travailler ces différents aspects prend du temps (de formation, plus que de réalisation), c'est donc un investissement personnel. Dans le cadre d'un projet professionnel ou en tant qu'amateur éclairé, ça vaut largement le coup. Par contre, s'il s'agit juste de réaliser un ou deux sites perso et de ne pas y passer trop de temps, ça peut paraitre excessif. Dans ce cas, il reste l'option Dreamweaver ou autre logiciel WYSIWYG, et on croise les doigts en espérant que ça passe (au moins pour le rendu visuel) sur les divers navigateurs.

Salut !

Mikachu, la bannière s'affiche mal sur les différents navigateurs, faut dire aussi que tu es sur ma page de test, la vraie page se trouve ici : http://www.metroid-master.com/index.php
Pour ce qui est de l'affichage des images avec Opera, je vois pas comment je pourrais remédier à ça et pour le moment c'est pas trop mon problème (avec une 50aine de visiteurs par jour, j'ai environ 0,1% de chance de tomber sur un visiteur utilisant Opera...)
Pour le moment, si le site s'affiche correctement sous Internet Explorer et Firefox, c'est le principal.
D'accord, vous voulez me donner des conseils de professionel, mais j'en suis pas un, j'ai encore beaucoup de choses à apprendre.

Pour en revenir à la bannière, je vais essayer la méthode que m'a donné Gizz. Ensuite, j'essaierais peut-être d'améliorer mon code, mais c'est pas ce que je compte faire en premier...

Merci pour vos réponses, je vais essayer de prendre tout ça en compte et on verra bien après. Je marque mon sujet comme résolu, même si ça fonctionne pas, je chercherais seul.

A+ !