Incompatibilité Safari/Chrome Webkit/Childtheme Wordpress Extra

Bonjour camarades,

J'ai modifié un template Wordpress, mais je n'arrive pas à obtenir le même résultat sur Safari que sur les autres navigateurs. (D'ailleurs il y a des différences d'affichage avec Safari (mis à jour) selon l'OS (Mac/Windows) apparemment, chose que j'essayerais de vérifier par la suite avec une VM.

Le problème, dans un premier temps concerne mon menu, qui sur Safari s'affiche verticalement alors que sur chrome s'affiche normalement, donc horizontalement.

Voici les modifications apportés dans mon thème enfant,

#eti-navigation > ul {
    justify-content: center;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

#eti-navigation > ul > li {
    display: inline;
    text-transform: uppercase;
    margin: 0 15px;
}

#eti-navigation > ul > li > a {
    position: relative;
    background-color:white;
    display: block;
    border: 0;
    padding: 0 0 0 0px;
}

Bon, je ne saisis pas grand chose aux web-kit, alors en bidouillant un peu grâce a (https://gist.github.com/cimmanon/727c9d558b374d27c5b6 pour rendre mon menu compatible aux justify-content j'ai rajouté les éléments suivants :

#eti-navigation > ul {
    justify-content: center;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap

    display: -webkit-box;
    -webkit-box-pack: center; 
}

Incroyable ça marche, le menu s'aligne normalement sur Safari, mais c'est maintenant sur Chrome (et uniquement sur Chrome) que mon menu s'aligne verticalement (avec exactement le même problème antécédent de Safari).

Le deuxième problème concerne le aside de mon site qui ne s'affiche pas à côté de mon main-content sur Safari. Mais là il s'agit probablement d'un problème du thème Extra de Elegant-thème sachant que j'ai se problème sur le thème parent également.

Si vous inspectez le site : http://mytrainingdiary.fr/ vous remarquerez peut être que j'ai fais quelques trucs pas vraiment préconisés avec le menu, Le css du menu au scroll down est différent du menu fixe ( j'ai du dupliquer son conteneur). Et j'ai rajouté quelques styles en dur dans le html parce que le thème était pour moi plutôt complexe dans la compréhension.

Mais là le problème est ailleurs, tous les navigateurs affichent le menu correctement mis à part Safari alors si vous avez une solution concernant le conflit qui se passe dans mes webkit, je suis preneur :)

En vous remerciant par avance pour votre aide !