सीएसएस में डेटा-यूआरआई एसवीजी पृष्ठभूमि फ़ायरफ़ॉक्स में काम नहीं कर रही है

Question

ठीक है, तो यहां मैं जो करने की कोशिश कर रहा हूं। मेरे पास यह कोड मेरी सीएसएस फ़ाइल

.form_row .textfield:hover, .textfield_m:hover 
{ 
    background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMCI+DQogIDxkZWZzPg0KICAgIDxsaW5lYXJHcmFkaWVudCBpZD0ibXlMaW5lYXJHcmFkaWVudDEiDQogICAgICAgICAgICAgICAgICAgIHgxPSIwJSIgeTE9IjAlIg0KICAgICAgICAgICAgICAgICAgICB4Mj0iMCUiIHkyPSIxMDAlIj4NCiAgICAgIDxzdG9wIG9mZnNldD0iMCUiICAgc3RvcC1jb2xvcj0iI2ZlZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+DQogICAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmMmY1ZjciIHN0b3Atb3BhY2l0eT0iMSIvPg0KICAgIDwvbGluZWFyR3JhZGllbnQ+DQogIDwvZGVmcz4NCg0KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIg0KICAgICBmaWxsPSJ1cmwoI215TGluZWFyR3JhZGllbnQxKSIgLz4NCjwvc3ZnPg==); 
    background-repeat:repeat; 
    background-color:White ; 
    background-clip: border-box; -moz-background-clip: border; -webkit-background-clip: border-box; 
    background-origin: border-box; -moz-background-origin: border; -webkit-background-origin: border-box; 
    -o-background-size: 100% 100%; -webkit-background-size: 100% 100%; -khtml-background-size: 100% 100%; background-size: 100% 100%; 
    animation: pulse .75s ease-in-out 0s infinite alternate; 
    -moz-animation:pulse .75s ease-in-out 0s infinite alternate; /*Firefox*/ 
    -webkit-animation:pulse .75s ease-in-out 0s infinite alternate; /*Safari and Chrome*/ 
    -o-animation:pulse .75s ease-in-out 0s infinite alternate; /*Safari and Chrome*/ 
} 

यह एक टेक्स्ट इनपुट में है।
प्रत्येक ब्राउज़र में यह ठीक काम करता प्रतीत होता है, लेकिन फ़ायरफ़ॉक्स 5 यह विफल रहता है। मुझे बस इतना कालाता मिलती है।
आप मैं यहाँ क्या दिखाई दे रही है http://www.skylabsonline.com/holy/
सूचना कि अन्य सभी प्रमुख ब्राउज़रों में यह ठीक प्रदर्शित करता है पर एक नज़र ले जा सकते हैं, लेकिन फ़ायरफ़ॉक्स 5 में यह पूरी तरह से विफल रहता है।
कोई विचार?

भी, यहाँ ऊपर Base64 के लिए एसवीजी कोड है, और मैं इस साइट का इस्तेमाल किया यह http://webcodertools.com/imagetobase64converter कन्वर्ट करने के लिए है, लेकिन बेस 64 हमेशा base64 है।

<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 1 1" preserveAspectRatio="none"> 
    <defs> 
    <linearGradient id="myLinearGradient1" 
        x1="0%" y1="0%" 
        x2="0%" y2="100%" 
        gradientUnits="userSpaceOnUse"> 
     <stop offset="0%" stop-color="#feffff" stop-opacity="1"/> 
     <stop offset="100%" stop-color="#d2ebf9" stop-opacity="1"/> 
    </linearGradient> 
    </defs> 

    <rect x="0" y="0" width="1" height="1" 
    fill="url(#myLinearGradient1)" /> 
</svg> 

Answer 1

फ़ायरफ़ॉक्स एक बग कि FF6 में तय किया गया था में ढाल टॉस करने के लिए समाप्त हो गया। A hash(#) in the Data URI source छवि को तोड़ देगा।

सामग्री में #%23 से बचने की आवश्यकता है।

संदर्भ

• Firefox 6 Release Notes: Updating Add-Ons - URL handling

• data URIs: No support for query strings, etc.

Answer 2

मैं सिर्फ मैन्युअल रूप से सीएसएस का उपयोग कर -moz-ढाल रेखीय की तरह कुछ का उपयोग कर()