Benutzerdefinierte Fontello-Symbole werden auf Mobilgeräten nicht korrekt angezeigt

Question

Ich habe eine Reihe von Symbolen aus Sketch als SVGs exportiert und sie über Fontello verarbeitet, um sie auf meiner Website zu verwenden. Alles ist gut für den Desktop (einschließlich mobiler Ansichten), aber die inneren Pfade scheinen speziell auf mobilen Geräten "zu verschwinden".

Ich habe dies auf iOS und Android getestet, mit dem Standard Safari Browser, Android Webbrowser und Google Chrome für Handys und hatte das gleiche Ergebnis.

In Sketch verwende ich eine kombinierte Form mit Union Ich habe dies auch mit Adobe Illustrator versucht, aber ich hatte das gleiche Ergebnis.

Wie es zeigt auf Desktop: icons on desktop

Wie es auf mobilen Geräten zeigt icons on mobile devices

Hier ein Beispiel für die SVG ist meine Sketch exportiert.

<?xml version="1.0" encoding="UTF-8" standalone="no"?> 
<svg width="113px" height="113px" viewBox="0 0 113 113" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> 
<!-- Generator: Sketch 3.6 (26304) - http://www.bohemiancoding.com/sketch --> 
<title>Combined Shape</title> 
<desc>Created with Sketch.</desc> 
<defs></defs> 
<g id="Introduction" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> 
    <g id="Facebook" transform="translate(-1.000000, -1.000000)" fill="#000000"> 
     <path d="M114,57.5 C114,26.2959116 88.7040884,1 57.5,1 C26.2959116,1 1,26.2959116 1,57.5 C1,88.7040884 26.2959116,114 57.5,114 C88.7040884,114 114,88.7040884 114,57.5 L114,57.5 L114,57.5 L114,57.5 L114,57.5 L114,57.5 Z M49.9465,88.7759701 L61.4605,88.7759701 L61.4605,59.8388273 L71.0245,59.8388273 L72.5035,48.5534939 L61.4605,48.5534939 L61.4605,41.3001606 C61.4605,39.5233987 61.8655,38.1550177 62.6065,37.1980654 C63.3475,36.3081606 64.7605,35.8296844 66.9145,35.8296844 L72.7735,35.8296844 L72.7735,25.7725415 C70.7545,25.4312082 67.9255,25.2940654 64.2235,25.2940654 C59.9125,25.2940654 56.4115,26.5923511 53.8525,29.1950177 C51.2275,31.7915892 49.9465,35.4853035 49.9465,40.2060654 L49.9465,48.5534939 L40.3855,48.5534939 L40.3855,59.8388273 L49.9465,59.8388273 L49.9465,88.7759701 L49.9465,88.7759701 L49.9465,88.7759701 L49.9465,88.7759701 L49.9465,88.7759701 Z" id="Combined-Shape"></path> 
    </g> 
</g> 
</svg> 

Answer 1

FYI Fontello unterstützt keine Füllregel oder Füllung. Ich versuche immer noch herauszufinden, wie ich dieses w/my-Icon umgehen kann, aber es wird das Verhalten verursachen, das du beschreibst.