Glyphicst Boootstrap Problemi di Firefox

So che ci sono molti altri problemi simili a questo, ma il mio non sembra soddisfare nessuno dei criteri degli altri problemi.Glyphicst Boootstrap Problemi di Firefox

I miei glyphic di Bootstrap 3 funzionano per tutti i browser tranne Firefox. Su Firefox, vengono visualizzati come simboli strani. Questo stesso problema è noto quando si servono i glyphicon da un CDN, ma non è un problema dato che utilizzo file di font localmente ospitati. Inoltre, ho già assicurato che i miei file non siano corrotti.

Ecco il mio codice.

<head> 
    <link rel="stylesheet" type="text/css" media="screen" href="/assets/css/bootstrap.min.css" /> 
    <link rel="stylesheet" type="text/css" media="screen" href="/assets/css/bootstrap-style.css" /> 
    <link rel="stylesheet" type="text/css" media="all" href="/assets/css/style.css" /> 
</head>

Il codice per la glyphicon:

<span class="glyphicon glyphicon-list-alt section-icon"></span>

ho già assicurato che i miei file sono affrontati in modo appropriato e fatto in modo di cancellare la cache. Non posso dire cosa mi manca qui. Suggerimenti?

fonte

2013-09-30 Thought Space Designs

ho avuto questo problema, ma serve css bootstrap da CDN risolto per me:

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet">

fonte

2015-02-28 15:54:14

YESSS.Questo risolve il mio problema! – thangcao

Firefox ha un'impostazione rigorosa (this) che impedisce al file HTML di accedere ai caratteri Web da cartelle non presenti nella directory principale. Ciò accade solo quando lavori localmente e non da file su un server. È necessario modificare un'impostazione in Firefox per visualizzare i glyphicon quando si sviluppa localmente.

-open "about: config" il proprio indirizzo in Firefox

-Allora di ricerca per la proprietà "security.fileuri.strict_origin_policy" e cambiarla da "true" a "false". (ignorare le virgolette ovviamente)

fonte

2013-10-16 17:14:27 Damathryx

sto deving sul server con i font sullo stesso server. –

Lo stesso problema qui. Avete qualche soluzione per questo? –

dal punto di vista dello sviluppatore, non è possibile fare affidamento sugli utenti per averlo capito. La soluzione deve essere passiva, non attiva alla fine dell'utente. – ahnbizcad

Mi ci è voluto un po 'per risolvere questo problema e il mio problema potrebbe essere diverso dagli altri in quanto vi sono risposte popolari che semplicemente non hanno funzionato per me. Questo perché il mio problema e la soluzione hanno a che fare con Amazon S3. Quindi se stai usando S3, continua a leggere.

Il problema è la configurazione CORS (Cross-Origin Resource Sharing). Ecco come risolverlo:

Accedi al tuo S3 e apri il bucket con il quale stai avendo problemi. Fai clic su "Proprietà" e quindi su "Autorizzazioni". Nel menu a discesa fai clic su "modifica configurazione CORS". Una finestra pop-up con il codice in una scatola che assomiglia a questo:

<CORSConfiguration> 
    <CORSRule> 
     <AllowedOrigin>*</AllowedOrigin> 
     <AllowedMethod>GET</AllowedMethod> 
     <MaxAgeSeconds>3000</MaxAgeSeconds> 
     <AllowedHeader>Authorization</AllowedHeader> 
    </CORSRule> 
</CORSConfiguration>

Eliminare questa riga:

<AllowedHeader>Authorization</AllowedHeader>

salvare e aggiornare la pagina di Firefox. Le tue icone dovrebbero ora apparire!

Dai un'occhiata a questi collegamenti per ulteriori informazioni in quanto mi hanno aiutato a risolvere questo: here e here e here. Se qualcuno può offrire maggiori informazioni sul perché questo funziona, per favore fallo!

fonte

2014-02-19 04:16:22 user2498172

Non sto usando S3, quindi questo sicuramente non è il problema con la mia configurazione. Grazie comunque! –

Glyphicst Boootstrap Problemi di Firefox

risposta

Problemi correlati