Coucou,
J'ai un petit problème.
Voilà, j'ai fait un menu horizontal sur mon site :
http://tb-world.forumotion.com/
à l'aide d'un widget et on peut voir des espaces noirs qui me dérange!
Peut être est-ce plus clair avec une image:

Spoiler:

Voilà aussi le code du widget:

Code:

<div style="text-align: center;"><img src="http://files.webopload.net/336228453.3.jpg"></div><table class="layout">
<tr>
<td><img src="http://files.webopload.net/704249485.11.jpg"></td>
<td><br>
<h3 id="fighter" menu=""><br></h3>
<p>J'écris ce que je veux</p>
</td><td><img src="http://files.webopload.net/748507477.22.jpg"></td>

</tr>

</table><div style="text-align: center;"><img src="http://files.webopload.net/1144345527.33.jpg">

Mercid'avance !

Coucou

Essaye comme ceci :

Code:

<div style="text-align: center;"><img src="http://files.webopload.net/336228453.3.jpg"></div><table class="layout"> <tr> <td><img src="http://files.webopload.net/704249485.11.jpg"></td> <td><br> <h3 id="fighter" menu=""><br></h3> <p>J'écris ce que je veux</p> </td><td><img src="http://files.webopload.net/748507477.22.jpg"></td>  </tr>  </table><div style="text-align: center;"><img src="http://files.webopload.net/1144345527.33.jpg">

Bonne Journée
Haricoow

Bonjour !

Penses à donner un titre explicite à ton sujet la prochaine fois s'il te plaît !

Les espaces qui s'affichent sont tout simplement dus aux marges qui s'appliquent par défaut aux blocs ainsi qu'entre les cellules du tableau. Tu aurais pu faire toi-même le test pour le vérifier tout simplement en appliquant une couleur aux bordures du tableau et des cellules
Pour corriger ton problème, il suffit donc de supprimer les marges du tableau et de tes div en insérant la propriété css "margin: 0px;" (ou margin-top & margin-bottom) soit dans le css de ton forum via une classe, soit directement dans ton html via "style=". Il va falloir coller les bords des cellules avec "border-collapse: collapse ;" (css) et dire qu'on ne veut pas de bordure avec "border: 0px;" ou dans le html border="0". Dernière chose à faire, supprimer les marges internes des cellules en précisant dans les balises table "cellpadding="0".
A priori il restera toujours un espace de 1px que je n'ai pas réussi à supprimer. Le meilleur moyen pour y remédier me semble être de faire une seule image et de la mettre en background, l'inconvéniant étant que cela oblige à faire une image plus grande, donc plus lourde.


Fu'

Coucou,
Alors, pour répondre à Haricoow, ça ne marche pas >.<
Ensuite Furase, désolé pour le titre (en plus on m'avait déjà fait la remarque) j'y penserai la prochaine fois.
Mon problème n'est donc toujours pas résolu et je ne comprend pas trop ce que tu veux dire Furase! Tu es pourtant clair j'imagine mais je ne comprend pas!
Y a t-il un truc a changer dans le css et le html du widget, si oui, que dois je faire ?

Merci

Oups pardon ^^"

(Yatta même réussi à virer le 1px en trop. Fallait juste changer de méthode. Bref...)

Essaie ceci :

Code:

<div style="text-align: center; margin-bottom: 0px;"><img src="http://files.webopload.net/336228453.3.jpg"></div>

<table cellpadding="0" class="layout">
<tr>
   <td><img src="http://files.webopload.net/704249485.11.jpg" /></td>
   
   <td>
      <br />
      <h3 id="fighter" menu=""><br /></h3>
      <p>J'écris ce que je veux</p>
   </td>
   
   <td><img src="http://files.webopload.net/748507477.22.jpg"></td>
</tr>
</table>
<div style="text-align: center; margin-top: 0px;"><img src="http://files.webopload.net/1144345527.33.jpg" /></div>

(En refermant le div à la fin c'est mieux XD)

Et dans le css, rajoute ceci en plus de tes autres propriétés :

Code:

.layout
{
   border-collapse: collapse ;
   border-width: 0px ;
}

.layout td
{
   border-width: 0px ;
}

Fu'

Ree!
Merci ça marche supêr!
Vous pouvez classer !