Supprimer un espace entre 2 images (HTML)

Fermé

redfish2009 Messages postés 3 Date d'inscription jeudi 28 mai 2009 Statut Membre Dernière intervention 4 juin 2009 - 28 mai 2009 à 19:46
arthezius Messages postés 3538 Date d'inscription jeudi 15 mai 2008 Statut Membre Dernière intervention 11 septembre 2016 - 6 juin 2009 à 12:50

Bonjour à toutes et à tous, :)

Voilà, quelques jours que j'essaie de trouver une solution à mon problème.

J'ai retravaillé une photo sous Photoshop et la divisé en plusieurs parties (4)pour avoir un meilleur affichage sur mon blog. J'ai ensuite inseré les 4 html.

Le problème c'est une séparation qui apparait entre les images. Je voudrais réunir mes 4 parties bout à bout.

Connaissez-vous un code HTML à rajouter ou à supprimer?

Merci d'avance

A voir également:

Supprimer un espace entre 2 images (HTML)
Espace insécable word - Guide
Supprimer une page word - Guide
Supprimer compte instagram - Guide
Comment liberer de l'espace sur gmail - Guide
Impossible de supprimer un fichier - Guide

6 réponses

Réponse 1 / 6

kryoportail Messages postés 222 Date d'inscription dimanche 10 août 2008 Statut Membre Dernière intervention 22 mai 2014 125
28 mai 2009 à 19:51

Salut,

Une solution utilisé anciennement via les tableaux :

<table cellspacing="0" cellpadding="0" border="0">
<tr><td><img src="1.jpg" /></td><td><img src="2.jpg" /></td></tr>
<tr><td><img src="3.jpg" /></td><td><img src="4.jpg" /></td></tr>
</table>

Autant te dire que c'est dégueulasse au niveau HTML...

Le mieux, à mon avis est de bricoler via CSS...

<style type="text/css">
<!--
#ImgContainer { width: 400px; height: 400px; }
#ImgContainer div { width: 200px; height: 200px; float: left; }
#Img1{ background-image: url(img1.jpg); }
#Img2{ background-image: url(img2.jpg); }
#Img3{ background-image: url(img3.jpg); }
#Img4{ background-image: url(img4.jpg); }
-->
</style>


<div id="ImgContainer">
<div id="Img1"></div>
<div id="Img2"></div>
<div id="Img3"></div>
<div id="Img4"></div>
</div>

Amicalement,
S@M...
http://kryoportail.ath.cx

Réponse 2 / 6

redfish2009 Messages postés 3 Date d'inscription jeudi 28 mai 2009 Statut Membre Dernière intervention 4 juin 2009
28 mai 2009 à 23:29

Merci beaucoup, ça fonctionne très bien ! Une dernière petite questioin.

Si je voulais réunir 3 images découpées de manière horizontale, serait-ce possible d'utiliser le code suivant? ...

<table cellspacing="0" cellpadding="0" border="0">
<tr><td><img src="image1.jpg" /></td></tr>
<tr><td><img src="image2.jpg" /></td></tr>
<tr><td><img src="image3.jpg" /></td></tr>
</table>

Merci

kryoportail Messages postés 222 Date d'inscription dimanche 10 août 2008 Statut Membre Dernière intervention 22 mai 2014 125
28 mai 2009 à 23:38

Re,

Oui, ça placera les images les unes en dessous des autres avec ce que tu as écrit...

Note : Quitte à être un peu chiant, les tableaux ne sont normalement pas fait pour positionner des éléments dans une page web !.... Mais tout simplement pour présenter des données tabulées !...

Pour donner du sens à son texte : on utilise le HTML (paragraphe, tableau, liste, titres, etc...)
Pour présenter le contenu : on utilise le CSS (positionnement, mise en gras, polices, etc...)
Ceci afin de rendre les sites accessibles au maximum de gens, de navigateurs, de systèmes.

cf: https://www.alsacreations.com/

Amicalement,
S@M...
http://kryoportail.ath.cx

Réponse 3 / 6

arthezius Messages postés 3538 Date d'inscription jeudi 15 mai 2008 Statut Membre Dernière intervention 11 septembre 2016 475
28 mai 2009 à 23:41

Autant le faire plus proprement. Le W3C recommande de ne plus utiliser les tableaux pour mettre en forme un site web. Ce que tu proposes là reviens au même.
Tu peux faire ça très bien de la manière suivante:

<div><img src="image1.jpg" /></div>
<div><img src="image2.jpg" /></div>
<div><img src="image3.jpg" /></div>

Et dans le CSS met les margin à 0px. Ainsi, tu supprimes tout espace entre les trois images.

Réponse 4 / 6

kryoportail Messages postés 222 Date d'inscription dimanche 10 août 2008 Statut Membre Dernière intervention 22 mai 2014 125
28 mai 2009 à 23:47

Re.....

Vi !!!!!! 100% d'accord....

Amicalement,
S@M...

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question

Réponse 5 / 6

redfish2009 Messages postés 3 Date d'inscription jeudi 28 mai 2009 Statut Membre Dernière intervention 4 juin 2009
4 juin 2009 à 08:59

Merci, beaucoup.

Vos réponses m'ont beaucoup aidés !

@ bientôt ...

RedFish

Réponse 6 / 6

arthezius Messages postés 3538 Date d'inscription jeudi 15 mai 2008 Statut Membre Dernière intervention 11 septembre 2016 475
6 juin 2009 à 12:50

Si ton problème est résolu, oublie pas de mettre le statu en résolu.

Discussions similaires

Espace en HTML

supprimer espace dans les nombres (Excel)

Discussions similaires

Newsletters