HTML/Tableau/Espaces autour d'une image
Résolu
alexou1984
Messages postés
406
Statut
Membre
-
Igoromus -
Igoromus -
Bonjour,
J'ai créé un tableau dans lequel se trouve une photo. Je n'arrive pas à faire en sorte que les bords du tableau collent à ceux de la photo. Il y a toujours un espace assez conséquent sous la photo. Je pense avoir tout essayé : marginheight ; valign ; cellpadding... ect. Je ne sais plus quoi faire. Quelqu'un peut-il m'aider ?
Voici mon code :
<center>
<table border="1" bordercolor="#0011ee">
<center>
<tr>
<center>
<td>
<center>
<a href="a.html">
<img src="a.jpg" width="100">
</a>
</center>
</td>
</center>
</tr>
</center>
</table>
</center>
Merci d'avance.
J'ai créé un tableau dans lequel se trouve une photo. Je n'arrive pas à faire en sorte que les bords du tableau collent à ceux de la photo. Il y a toujours un espace assez conséquent sous la photo. Je pense avoir tout essayé : marginheight ; valign ; cellpadding... ect. Je ne sais plus quoi faire. Quelqu'un peut-il m'aider ?
Voici mon code :
<center>
<table border="1" bordercolor="#0011ee">
<center>
<tr>
<center>
<td>
<center>
<a href="a.html">
<img src="a.jpg" width="100">
</a>
</center>
</td>
</center>
</tr>
</center>
</table>
</center>
Merci d'avance.
A voir également:
- HTML/Tableau/Espaces autour d'une image
- Tableau word - Guide
- Espaces insécables - Guide
- Tableau ascii - Guide
- Trier un tableau excel - Guide
- Imprimer tableau excel sur une page - Guide
6 réponses
Une explication sur cet espace génant et comment s'en debarasser :
https://developer.mozilla.org/fr/docs/Archive/Misc_top_level/Images,_tableaux_et_d%C3%A9calages_myst%C3%A9rieux
https://developer.mozilla.org/fr/docs/Archive/Misc_top_level/Images,_tableaux_et_d%C3%A9calages_myst%C3%A9rieux
Merci beaucoup pour ces réponses. Juste une question, le "no-repeat" et le "text-align:center" servent à quoi ? "text-align:center" c'est pour centrer l'image c'est ça ?
Avec 'no-repeat' l'image ne répète pas (parce qu'elle est comme le fond/background du div).
Et 'text-align:center' c'est pour aligner le TEXT au centre du div non l'image.
Pour aligner l'image faites ça:
<div style="background:url(a.jpg) no-repeat; border:1px solid #000000; height:100px; width:150px; text-align:center;" onclick="javascript:window.location='a.html';" ALIGN='CENTER'></div>
Ou avec une table:
<table align='center'>
<tr>
<td>
<div style="background:url(a.jpg) no-repeat; border:1px solid #000000; height:100px; width:150px; text-align:center;" onclick="javascript:window.location='a.html';"></div>
</td>
</tr>
</table>
Je vous suggère ces sites:
https://www.cssdebutant.com/
http://www.cssplay.co.uk
Et 'text-align:center' c'est pour aligner le TEXT au centre du div non l'image.
Pour aligner l'image faites ça:
<div style="background:url(a.jpg) no-repeat; border:1px solid #000000; height:100px; width:150px; text-align:center;" onclick="javascript:window.location='a.html';" ALIGN='CENTER'></div>
Ou avec une table:
<table align='center'>
<tr>
<td>
<div style="background:url(a.jpg) no-repeat; border:1px solid #000000; height:100px; width:150px; text-align:center;" onclick="javascript:window.location='a.html';"></div>
</td>
</tr>
</table>
Je vous suggère ces sites:
https://www.cssdebutant.com/
http://www.cssplay.co.uk
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
<table border="0" cellpadding='0' cellspacing='0'>
ou
<table border="1" bordercolor="#0011ee" cellpadding='0' cellspacing='0'>
et aussi:
<table border="1" bordercolor="#0011ee" align="center" cellpadding="0" cellspacing="0">
<tr>
<td>
<div style="background:url(a.jpg) no-repeat;" onclick="javascript:window.location='a.html';" align="center">
</td>
</tr>
</table>
ou
<table border="1" bordercolor="#0011ee" cellpadding='0' cellspacing='0'>
et aussi:
<table border="1" bordercolor="#0011ee" align="center" cellpadding="0" cellspacing="0">
<tr>
<td>
<div style="background:url(a.jpg) no-repeat;" onclick="javascript:window.location='a.html';" align="center">
</td>
</tr>
</table>