Affichage SVG en background sous Edge

**eleydet** · 01/07/2022, 14h01

Bonjour,

Voici ce que j'ai écrit. Index.html :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
<!DOCTYPE html>
<html>
 
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="style.css">
</head>
 
<body>
<span class="vec">V</span>
</body>
 
</html>

style.css :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
.vec {
  margin: 0px;
  padding: 7px 3px 0px 2px;
  background-repeat: no-repeat;
  background-position: 100% 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='6'><style>line {stroke:rgb(0,0,0);}</style><line x1='0' y1='3' x2='300' y2='3'/><line x1='300' y1='3' x2='295' y2='0'/><line x1='300' y1='3' x2='295' y2='6'/></svg>");
}

Ce sujet a probablement déjà été abordé, veuillez m'en excuser. Ces codes fonctionnent bien avec Firefox ou Chrome, mais pas avec Edge. Cela fonctionne avec Edge si je place l'image dans un fichier à part, mais je préfère placer mon image au sein du code en CSS plutôt que dans un fichier à part. Auriez-vous une solution, une correction à apporter?

Bien à vous.