Bonjour,

J'ai un souci avec la gestion des espaces (verticaux et horizontaux) sur safari:

J'ai un menu que je met en position: absolute; c'est un div avec deux div à l'intérieur (j'utilise donc un flex-box pour les aligner)

j'utilise un top:472.5px; afin de mettre tout ça juste avant le corps du site.

Résultat: ça marche sur IE,FF,chrome, mais sur safari, le menu chevauche le corps du site de quelques pixels.

Je ne sais pas si c'est lié mais mon menu de pieds de page (qui s'affiche normalement sur IE, FF et chrome) est coupé horizontalement sur safari (il est dans un div de largeur fixe) . Il semblerait que les espaces horizontaux entre deux div consécutifs soient plus grands sur safari que  sur les autres navigateurs (mon menu de pieds de pages est constitués de plusieurs div mis en flex).

Quelqu'un aurait-il une idée de ce qu'il faut faire pour régler tout ça?

Merci d'avance

-
Edité par Dr_strange 22 août 2017 à 15:01:14

Bonjour,

1) les demi-pixels ça n'existe pas

2) une page web n'est pas une diapo Powerpoint, on ne place pas ses éléments comme ça

Évite à tout prix position: absolute pour ce genre de cas. Peux-tu nous montrer ta page en ligne, et un schéma de ce que tu attends ?

Bonjour, Lamercalate

J'ai viré le position:absolute; et cela n'a pas eu d'incidence sur la position de mon menu (pourquoi je l'ai mis au départ ?)

Voici le style du menu :

#menux {
   display: flex;
   display: -webkit-box;
	width: 900;
	z-index:1;
	border: 1px solid red;
}

Je travaille en local. Voici le rendu sur Safari :

 Celui sur chrome (le bon )

:

PS: Je me souviens de la raison pour laquelle j'ai mis le menu en position:absolute; autrement, au clic sur une des catégories, le menu déroulant ne se superpose pas au corps du site (ce qui est pourtant le comportement souhaité). Au final, je reviens à mon bon vieux position:absolute

-
Edité par Dr_strange 22 août 2017 à 18:08:13