Espace entre image et block en CSS

  • Auteur de la discussion Auteur de la discussion sim100
  • Date de début Date de début
WRInaute passionné
Bonjour
Dans un de mes sites que je suis en train de faire en CSS, j'ai une colonne à gauche où il y a des blocks contenant des menus.

Le block est composé d'une image (titre du block) en haut et du block en lui même avec un bord de 1 pixel.

Donc j'ai dans mon index.php

Code:
<img src="design/top-block-travel.gif">
		<div id="blockleft">test</div>

Pour le block (id="blockleft") j'ai dans mon CSS
Code:
#blockleft {
	width: 138px;
	border: #F3E7C6 1px solid;
	}

Voila, le problème est juste que entre l'image et le block j'ai un petit espace! Alors que ça devrait être collé.

Comment enlever cet espace?

Merci
 
WRInaute impliqué
tu peux essayer avec:
Code:
#blockleft {
   width: 138px;
   border: #F3E7C6 1px solid;
   margin: 0 0 0 0;
   }
si ça marche pas, donne une classe à img avec la même propriété margin

je pense que ça doit fonctionner
 
WRInaute passionné
non

Ca ne marche pas, mais c'est marrant car si dans mon index.php je mets

Code:
<img src="design/top-block-travel.gif" class="test"><div id="blockleft">test</div>
sans retour à la ligne entre l'image et le div, alors c'est bon pour IE, mais toujours pas bon pour Firefox et Opera!

C'est comme si il y avait un retour à la ligne.

Une idéé SVP :cry:
 
WRInaute passionné
ouai

Bon après plusieurs heures de recherche j'ai finalement trouvé, donc vu que j'emmer... tout le monde à chaque fois sur ce forum, j'en fais profiter :D

En mettant un
Code:
img  {border: 0; VERTICAL-ALIGN: middle}
dans le CSS ça fait l'affaire
 
WRInaute impliqué
ok :wink:
par contre il manque un " ; " après middle il me semble et si t'en a pas vraiment besoin, je ne vois pas trop à quoi il sert ?? :?
 
WRInaute passionné
oui

A confirmer pour le ; mais comme c'est la dernière instruction il n'est pas obligatoire?
Enfin j'ai vu sur d'autre site ils ne le mettrent pas!

"si t'en a pas vraiment besoin, je ne vois pas trop à quoi il sert ?? "
C'est pour quoi?
 
WRInaute impliqué
"si t'en a pas vraiment besoin, je ne vois pas trop à quoi il sert ?? "
C'est pour quoi?
Oui pardon, je parlai du vertical-align
Pour le ; je croyai qu'il le fallait à toutes les lignes tiens :P
 
WRInaute passionné
oui

Bin pour le vertical align c'est ce qui fait que ça marche, c'est ce que j'ai rajouté pour résoudre mon problème.
Le border: 0; il y était déja et ça ne résolvait rien!
 
WRInaute impliqué
Ok merci :wink:

je me le note dans un coin, fallait le trouver le truc ?? à moins que spécialiste css puisse donner la raison ?

++
 
Discussions similaires
Haut