28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

Voila, je me retrouve devant un problème pour lequel je ne trouve pas de solution.

Je suis dans le cas de figure suivant :

<div>
   <a href="monLien.php">
      <img src="image.png" />
   </a>
</div>


A savoir que mon div fait 185px par 185px et que mon img fait une taille inconnue mais toujours plus grande de la div.

actuellement donc je vois la partie haut gauche de l'image, mais j'aurais aimé la centrer dans la div... Y aurait il une solution ?

Merci d'avance.
A mon avis il y a 2 solutions :

- utiliser javascript pour dynamiquement replacer l'image, sachant que son conteneur devra être en position:relative et l'image en position:absolute.

- mettre l'image en arriere plan soit dans la div, soit dans le lien avec un background-position: center center;
Euh... Le background, c'est pas une bonne idée... Cette image est le support d'un lien et on peut facilement deviner qu'elle porte du contenu. Elle n'a donc strictement rien à faire dans le code CSS ! Elle doit rester dans le code HTML avec un attribut alt correctement rempli.
bonjour,

il y a line-height adapté et le plus simple dans ton cas: 1div hauteur fixe et une seule ligne/image.

GC
Je ne suis pas forcément d'accord avec toi Laurie-Anne dans la mesure où l'image est une illustration du lien et que l'on peut parfaitement insérer du contenu via le texte du lien (et le masquer avec text-indent) ou son attribut title.
Nukleo a écrit :
Je ne suis pas forcément d'accord avec toi Laurie-Anne dans la mesure où l'image est une illustration du lien et que l'on peut parfaitement insérer du contenu via le texte du lien (et le masquer avec text-indent) ou son attribut title.
...

Fait une page de test, désactive les images et laissant les styles activés et tu te retrouvera dans un cas très commun de "connec qui mer**" ou de "serveur qui rame".

Oh magie plus d'image, plus de lien...


Donc je le répète : le contenu dans le HTML !
Laurie-Anne a écrit :
...
Fait une page de test, désactive les images et laissant les styles activés et tu te retrouvera dans un cas très commun de &quot;connec qui mer**&quot; ou de &quot;serveur qui rame&quot;.


Touché !
en même temps si il n'y a qu'une image encadrée par une balise <a> et qu'effectivement les images ne s'affichent pas il n'y aura pas plus de lien qu'avec ma suggestion Smiley smile
D'où l'intérêt d'un alt correctement rempli qui prendra la place de l'image n'ayant pas pu s'afficher

(coulé ?)
Pas loin Smiley smile
Je pense que là on peut enchainer sur un débat de sémantique et de ce qui peut etre considéré comme du contenu à proprement parler ou de l'esthétique.

J'avoue que je n'ai pas envie (ni le temps d'ailleurs) de me lancer sur cette pente glissante Smiley smile

En tout cas ton point de vue me paraît tout à fait défendable et je m'inclinerais donc