Bordure bleu lors du clic avec balise <area> dans <map>

Résolu

Alker -
Alker - 21 nov. 2017 à 15:50

Bonjour, je suis actuellement entrain de faire un site web pour faire passer le temps, et j'ai ajouté une image avec les différents boutons pour les réseaux sociaux, mais lors du clic, j'ai des bordure bleu qu'y apparaissent, j'aimerai les enlever sauf que toutes les solutions proposés sur les autres sujet de fonctionne pas... J'aurai besoin de vous pour savoir ce qu'il ne va pas dans mon programme. Merci d'avance, Alker.

Mon fichier HTML:

<!doctype html>
<html lang="fr">
	<head>
 		<meta http-equiv="X-UA-Compatible" content="IE=edge">
   		<meta charset="utf-8">
   		<meta name="description" content="Page officielle de l'Association Lorraine Furs. Promotion du furry fandom en France et en Lorraine.">
   		<meta name="keywords" content="association, furry, france, lorraine, furs, fursuit, fandom, fursuiting, furwalk, nancy, epinal">
   		<link media="only screen and (max-width: 370px)" rel="alternate" href="http://www.lorrainefurs.fr/phone/index.html">
  		<title>Accueil Lorraine Furs</title>
   		<link rel="shortcut icon" href="img/pawico.ico">
   		<link rel="stylesheet" href="style.css" type="text/css" media="screen">
	</head>
	<header>
		<img src="img/logo.png" alt="Mascotte">
		<img src="img/social.png" width="1250" height="300" border="0" usemap="#map" />

<map name="map">
<area shape="poly" coords="278,79,290,65,309,50,332,41,364,41,389,50,413,68,430,103,431,140,430,249,267,249,267,112,270,95,275,86,278,78" href="http://www.facebook.com/lorrainefurs" />
<area shape="poly" coords="446,116,447,249,611,249,609,110,602,88,597,77,588,69,581,60,570,53,556,46,541,42,512,41,495,47,474,59,462,72,448,97,446,115,445,115" href="http://www.twitter.com/lorraine_furs" />
<area shape="poly" coords="623,115,628,96,649,64,677,47,697,43,724,43,751,53,779,80,790,108,791,139,793,253,624,252,623,113" href="https://telegram.me/lorrainefurs" />
<area shape="poly" coords="809,118,818,83,845,56,880,43,921,46,952,65,967,90,974,115,973,252,809,251,808,118,809,118,807,118,808,117" href="https://www.flickr.com/photos/lorrainefurs/albums" />
<area shape="poly" coords="993,105,1014,66,1044,46,1062,42,1088,42,1118,55,1139,74,1153,106,1155,123,1156,252,991,251,990,109,992,106,993,104" href="***@***" />
</map>
	</header>
	<div style="text-align: center"><img src="img/down.png" align="center" alt="bas" width="50"  ></div>

Ma feuille CSS:

html {
	margin:0;
	padding:0;
	background: url("img/bckgrnd.jpg") no-repeat center fixed;
	background-size: cover;
}
header {
    text-align: center;
}

map area{
	border:none;
}

PS: La feuille CSS est appliqué sans problème sur les balise html et header.

A voir également:

Bordure bleu lors du clic avec balise <area> dans <map>
Supprimer rond bleu whatsapp - Guide
Google map satellite gratuit - Guide
Bordure de page word - Guide
Atout clic - Télécharger - Éducatifs
Clic molette ne fonctionne plus - Forum souris / Touchpad

2 réponses

Réponse 1 / 2

Pitet Messages postés 2826 Date d'inscription Statut Membre Dernière intervention 527

Salut,

La bordure ajouté lors du focus sur une area vient surement de la propriété css outline qui affiche effectivement par défaut une bordure bleue sous Chrome.

Tu devrais pouvoir la désactiver avec ceci :

area {
    outline: none;
}

Bonne journée,

Réponse 2 / 2

Alker

Yay !!!! Ça fonctionne, merci j'étais entrain de péter un plomb à cause de ça :3

Discussions similaires

Clic molette qui ne marche pas

Votre réponse

Discussions similaires