Bonjour, je rencontre un problème avec un lien, en effet plus celui-ci est proche d’une image moins la <<zone de clique>> du lien est accessible et même à un certain moment impossible...

Suis-je obligé de déplacer l’image concernée  ? (Car celle-ci rend le lien impossible, dommage car elle était placé parfaitement.). Ou par chance une méthode permettant d’allonger la zone de clique du lien sans déplacer l’image d’un seul pixel existe ? 

Merci si vous ajoutez une réponse ! 

-
Edité par L.O.D.A 12 juillet 2019 à 12:16:47

Bonjour,

Mauvais titre

Le titre est un élément important qui ne doit pas être négligé. N'oubliez pas cette règle simple : le titre idéal résume la question que vous allez poser en une petite phrase. Il doit permettre aux visiteurs de se repérer facilement dans le forum visité et d'identifier le sujet à sa seule lecture.

Vous pouvez utiliser divers préfixes comme [Erreur], [MySQL], [Compatibilité], etc... Aussi, pensez à consulter les règles propres à chaque forum (visibles dans les topics épinglés en haut des sections).

De plus, choisir un bon titre permet de rendre plus faciles les recherches des autres membres.

Les titres de type "besoin d'aide" ou "problème" ne sont pas tolérés.

Pour modifier votre titre, éditez le premier message de votre sujet.

(titre originel : Problème image et lien)

Bonsoir, je ne suis pas sur de comprendre le problème; Sans voir ton code, je dirais qu'il faut indiquer un display: block; sur le lien.....

Bonjour, 

Merci et désolé (C'est bon j'ai remplacé le titre). Votre proposition "display: block;" ne répare pas malheureusement mon problème.

En gros l'image est trop près du lien pour que ce dernier fonctionne. Ce lien est un "bouton" permettant d'aller sur une autre page.

Voici les codes importants: (Pour une page avec "max-width: 480px")

.bateau{        /*image décoratif*/
	width: 290px;
	height: 145px;
	position: absolute;
	left: 40px;
	top: 0px;
	}

	
.Oceanacceuil{                /*bouton permettant d'aller sur l'autre page*/
		position: absolute;
	top: 0px;
	right: 0px;
	
	background-image: url(https://media.giphy.com/media/uxbIr5yajuWti/giphy.gif);
	color: white;
	display: inline-block;
list-style-type: none;
text-decoration: none;
flex-wrap: nowrap;
}

Merci si quelqu'un ajoute une réponse !

Ma proposition du display: block; était à appliquer sur un lien (balise <a>) pour que celui-ci prenne toute la place que son parent le permet.

Quel est le code HTML correspondant à ce CSS? Votre code est-il valide?

Pour la class Oceanacceuil si il y à un position: absolute; le display: inline-block; est inutile, c'est un ou l'autre.

Vous utilisez position: absolute; quel est l’élément référent? autrement dit quel est l'élément qui est en position: relative; ?

Bonjour c’est bon j’ai trouvé grâce à  Mr Andriano :https://openclassrooms.com/fr/membres/henryandriano (Je conseil à tout le monde de regarder ses services.) Merci quand même bonne journée !