Bonjour,

Alors j'ai découvert le border-image en css et j'essaie de gérer ça avec un svg :

Avec ce code ça marche parfaitement :

border-image-source: url("dashed-border.svg");
border-image-slice: 4;
border-image-repeat: round;  

Petite problématique, je veux pouvoir modifier facilement la couleur de mon svg.
Du coup j'essaie d'insérer directement le code dans le css.

J'ai trouvé ça : https://stackoverflow.com/questions/10768451/inline-svg-in-css

J'ai essayé d'apapter le code que j'ai trouvé à mon svg :

border-image-source: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'><path fill='#000000' fill-rule='evenodd' d='M12 12H8v-1h3V8h1v4zM1 1v3H0V0h4v1H1zm11-1v4h-1V1H8V0h4zM1 11h3v1H0V8h1v3z'/></svg>");
border-image-slice: 4;
border-image-repeat: round;  

Pas de bol ça ne fonctionne pas

Est-ce que l'un de vous aurait une idée de ce que j'ai mal fait ?

Merci !

-
Edité par Sephir0th 11 avril 2019 à 13:59:11