Quelqu'un a-t-il déjà rencontré le problème suivant sous Safari ?
Lorsque l'on met une liste sous forme "horizontale", de largeur fixe, avec un overflow caché, tous les navigateurs modernes affichent la liste "partiellement", permettant d'utiliser d'autres choses comme ECMAScript pour faire un scroll horizontal événementiel. Bref.
La plupart, SAUF Safari qui met le DERNIER élément de la liste sur une autre ligne !
Pour contourner le problème, il suffit d'appliquer la propriété CSS white-space (valeur: nowrap) sur l'élément ul. Un exemple de telle liste en-ligne (mettez un certain nombre d'éléments de liste pour que l'effet se voie) :
En espérant que ça puisse donner des idées à beaucoup de monde pour des contenus scrollables via javascript, mais accessibles
Modifié par Ladytron (03 May 2006 - 09:51)
Lorsque l'on met une liste sous forme "horizontale", de largeur fixe, avec un overflow caché, tous les navigateurs modernes affichent la liste "partiellement", permettant d'utiliser d'autres choses comme ECMAScript pour faire un scroll horizontal événementiel. Bref.
La plupart, SAUF Safari qui met le DERNIER élément de la liste sur une autre ligne !
Pour contourner le problème, il suffit d'appliquer la propriété CSS white-space (valeur: nowrap) sur l'élément ul. Un exemple de telle liste en-ligne (mettez un certain nombre d'éléments de liste pour que l'effet se voie) :
ul#votre_id
{
width: 300px;
overflow: hidden;
white-space: nowrap;
}
ul#votre_id li
{
display: inline;
}
Les éléments de la liste s'affichent alors correctement, tous sur la même ligne.En espérant que ça puisse donner des idées à beaucoup de monde pour des contenus scrollables via javascript, mais accessibles
Modifié par Ladytron (03 May 2006 - 09:51)