Faire un lien sur une image ?

Faire un lien sur une image ? Noter :

#1 Tabouet

Groupe : Webmaster Régulier
Messages : 65
Inscrit(e) : 16-septembre 11
Genre:Homme
Localisation:là
Société:Auto-entrepreneur

Posté 23 novembre 2011 - 15:28

Bonjour,

J'ai besoin de faire un lien sur une image.
Je pensais que ça allait être tout simple avec ce petit bout de code :

<a href="machin.html"><img src="images.jpg" width="250"></a>

Mais ça ne fonctionne pas :mad2:

Pourtant c'est un truc de base que j'ai déjà du faire des centaines de fois...

Auriez-vous une suggestion ?

Merci et à bientôt,

Haut

#2 yuston

Groupe : Membre+
Messages : 589
Inscrit(e) : 07-octobre 04
Genre:Homme
Localisation:Lausanne

Posté 23 novembre 2011 - 15:42

Salut,

Tu travailles sous quel doctype? Est-ce que tu as bien une image qui s'appelle images.jpg dans le même dossier que ton fichier .html qui contient le code que tu as écrit?

Andersen Lau - Me retrouver sur Twitter
Pour les jeunes qui n'ont pas encore réussi le permis de conduire, faites une petite accélération (prioritairement en voiture!) sur Le-Permis.ch. A fond les pédales!

Haut

#3 Tabouet

Groupe : Webmaster Régulier
Messages : 65
Inscrit(e) : 16-septembre 11
Genre:Homme
Localisation:là
Société:Auto-entrepreneur

Posté 23 novembre 2011 - 16:03

Merci pour ta réponse,

J'ai ce doctype :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Pour les chemins vers l'image et vers le fichier html, je suis certain qu'ils sont bons.
J'ai oublié de précisez que l'image est dans un <div>

<div class="imagegauche">
<a href="machin.html"><img src="images.jpg" width="250"></a>
</div>

Ce message a été modifié par Tabouet - 23 novembre 2011 - 16:05.

Haut

#4 Leonick

Groupe : Hubmaster
Messages : 1 313
Inscrit(e) : 07-mars 05
Genre:Homme
Localisation:Val de Marne

Posté 23 novembre 2011 - 16:45

pourquoi utiliser un tel doctype "XHTML 1.0 Strict" quand le code est invalide ?

Ce message a été modifié par Leonick - 23 novembre 2011 - 16:45.

Leonick
triathlon val de reuil, traversée des Alpes en vélo, photos Irlande

Haut

#5 Tabouet

Groupe : Webmaster Régulier
Messages : 65
Inscrit(e) : 16-septembre 11
Genre:Homme
Localisation:là
Société:Auto-entrepreneur

Posté 23 novembre 2011 - 16:56

C'est une page en cours de construction qui n'a pas encore eu le temps d'être validée.
De toute façon, quelque soit le doctype, ça ne marche pas.

Histoire de localiser la source du problème, j'ai remplacé mon image par du texte, pour avoir un lien "normal";

<div class="imagegauche">
<a href="machin.html">test de lien</a>
</div>

Et ça ne fonctionne pas.
Quand le curseur est sur le lien, il ne devient même pas "un doigt" et quand je clique rien ne se passe.

Ce message a été modifié par Tabouet - 23 novembre 2011 - 17:15.

Haut

#6 Ernestine

Groupe : Fondatrice
Messages : 1 034
Inscrit(e) : 21-août 03
Genre:Femme

Posté 23 novembre 2011 - 17:17

N'y aurait-il pas un div (ou autre bloc) par-dessus ton lien ? Genre avec des positionnements en absolute ? Si c'est le cas, il faut mettre des z-index pour paramétrer les superpositions de divs.

Haut

#7 Nicolas

ChatMaster

Groupe : Fondateur
Messages : 4 262
Inscrit(e) : 19-août 03
Genre:Homme
Localisation:Peyrolles

Posté 23 novembre 2011 - 17:17

Le problème est p-e au niveau de ta classe "imagegauche" alors.

Essaye en enlevant le div pour voir si ca fonctionne.

- C-VU : Présentez votre site
- REFTOWEB : Référencement de sites
- HEBTOWEB : Guide hébergement de site Internet

Haut

#8 Tabouet

Groupe : Webmaster Régulier
Messages : 65
Inscrit(e) : 16-septembre 11
Genre:Homme
Localisation:là
Société:Auto-entrepreneur

Posté 23 novembre 2011 - 17:36

Mouais... je crois qu'il y avait comme un problème avec les div et les positions.

le code de départ était le suivant:

<div class="imagegauche">
<a href="machin.html">toto</a>
</div>
		
<div style="position:relative;padding-right:10px;">
du code...
</div>

Il est devenu :

<div class="imagegauche">
<a href="machin.html">toto</a>
</div>
		
<div style="margin-left:470;padding-right:10px;">
du code...
</div>

Maintenant ça à l'air de fonctionner, il y avait une sorte de superposition des div.
D'où le lien qui était inaccessible.

Ce message a été modifié par Tabouet - 23 novembre 2011 - 17:39.

Haut

#9 Leonick

Groupe : Hubmaster
Messages : 1 313
Inscrit(e) : 07-mars 05
Genre:Homme
Localisation:Val de Marne

Posté 23 novembre 2011 - 17:37

en xhtml, les images se finissent par />
essaie d'ajouter un fond rouge derrière ton lien, ça te permettra de voir s'il est accessible à la souris, pour ça, ajoute un id dans ton <a>

Leonick
triathlon val de reuil, traversée des Alpes en vélo, photos Irlande

Haut

#10 Tabouet

Groupe : Webmaster Régulier
Messages : 65
Inscrit(e) : 16-septembre 11
Genre:Homme
Localisation:là
Société:Auto-entrepreneur

Posté 23 novembre 2011 - 18:29

Le problème semble résolu...
Je ferai quelques tests demain (à tête reposée) et je vous tiens au courant.

Haut

#11 Dudu

Groupe : Admin
Messages : 3 823
Inscrit(e) : 09-avril 05

Posté 24 novembre 2011 - 17:26

Salut

De manière générale, il vaut mieux ne pas surcharger de <div>, surtout quand ce n'est pas indispensable.
Ici, typiquement le <div> '"imagegauche" n'a pas l'air de servir à grand chose... à part à créer du bordel sur un simple lien tout bête

(De plus, il est préférable de ne pas nommer ses identifiants et ses classes avec des trucs du style "colonne-verte", "image-gauche", bordure-rouge-en-haut-a-gauche" etc. Le jour ou tu modifies le design de ton site, la colonne sera peut-être violette, l'image sera peut-être centrée ou à droite, la bordure sera peut-être différente, ou inexistante

)

Bref, revenons à nos moutons, ce <div> a l'air d'être là juste pour pallier un défaut de sémantique ou de bonne utilisation du CSS.
Sans voir la page, mais sur un simple a priori, je dirais qu'une bonne règle CSS bien ciblée permettrait de l'enlever

Un petit article intéressant sur la divite aiguë, cette maladie grave !