2013-11-21 12 views
6

Sto progettando un layout di messaggistica e sto cercando di risolvere alcune cose su Safari in quanto sembra un problema di compatibilità.Problema di Safari con justify-content: flex-end; align-items: flex-end;

http://animgram.com/fb/index.html Se si apre questo collegamento su Google Chrome e Safari. Google Chrome è la visualizzazione corretta ma su Safari non viene visualizzata correttamente.

Sto lottando per impostare questa classe.

.self { 
justify-content: flex-end; 
align-items: flex-end; 
} 

Nota: solo Safari è il problema. IE, Chrome e Firefox sono perfettamente OK.

+0

Si prega di essere a conoscenza di una corretta etichettatura. Questo non ha nulla a che fare con Adobe/Apache UI Framework, quindi ho rimosso il tag Flex. Sospetto che si riferisca a FlexBox il framework CSS; quindi ho aggiunto il tag Flexbox. Se ciò non è corretto, puoi correggere il tagging. – JeffryHouser

+0

Quale versione di Safari? – cimmanon

+0

Ultima versione per Windows 5.1.7 –

risposta

15

Safari < 7.0 ha solo un'implementazione del vecchio 2009 specifica Flexbox, che è molto diverso dalle specifiche moderna:

.foo { 
    display: -webkit-box; 
    -webkit-box-pack: start; /* justify-content */ 
    -webkit-box-align: start; /* align-items */ 
} 

Questo potrebbe essere utile: https://gist.github.com/cimmanon/727c9d558b374d27c5b6

Problemi correlati