Bonjour,
J'ai beau chercher je commence à perdre l'espoir de trouver une solution à mon problème.
Je dois faire un menu dont les éléments sont disposés verticalement. Chaque élément du menu reçois un texte généré par du php qui peut s'avérer plus long que la largeur de la case qui le recoit.
Hors l'idée c'est de masquer ce qui dépasse de cette case ("bouton"). Pour ca j'ai fait un white-space:nowrap (histoire que le texte soit sur la même ligne) puis dans l'élément conteneur je met un overflow:hidden. Tout va bien jusque là.
Là où ca deviens un peut plus chaud, c'est qu'on aimerais que ce soit la fin de la chaine qui soit visible dans la case. Autrement dit l'équivalent d'un text-align:right.
Par exemple si ma chaine c'est : "Un texte très long qui va dépasser de mon bouton et la date d'aujourd'hui est le 14 mai". Hé bien l'overflow va dépasser par la droite et on vera dans le bouton "Un texte très long" (le reste étant occulté).
Sur firefox le problème se résoud facilement : un float:right et hop c'est la fin de la chaine qui est visible. Mais sur IE, le float:right ne marche que lorsque le div intérieur est plus petit que le conteneur. Aussitôt que le div intérieur (qui contient mon texte) est plus grand, le float:right ne change rien et le texte dépasse malgré tout sur la droite.
Petite précision, comme il peut y avoir beaucoup d'éléments à mon menu, il y a une taille au delà de laquelle le div du menu ne s'agrandit plus et une scroll apparait. Par conséquent il me faut une solution qui permette que les éléments restent dans le flux à cause de cette scroll.... Et oui... sinon avec des petites position absolute et right:0 ce serait pret depuis longtemps
Merci d'avance pour votre aide !
html :
Inutile de poster le CSS, il s'agit simplement d'un float:right pour div.nom et les tailles qui sont définies.
Modifié par XIV-V (14 Nov 2008 - 14:26)
J'ai beau chercher je commence à perdre l'espoir de trouver une solution à mon problème.
Je dois faire un menu dont les éléments sont disposés verticalement. Chaque élément du menu reçois un texte généré par du php qui peut s'avérer plus long que la largeur de la case qui le recoit.
Hors l'idée c'est de masquer ce qui dépasse de cette case ("bouton"). Pour ca j'ai fait un white-space:nowrap (histoire que le texte soit sur la même ligne) puis dans l'élément conteneur je met un overflow:hidden. Tout va bien jusque là.
Là où ca deviens un peut plus chaud, c'est qu'on aimerais que ce soit la fin de la chaine qui soit visible dans la case. Autrement dit l'équivalent d'un text-align:right.
Par exemple si ma chaine c'est : "Un texte très long qui va dépasser de mon bouton et la date d'aujourd'hui est le 14 mai". Hé bien l'overflow va dépasser par la droite et on vera dans le bouton "Un texte très long" (le reste étant occulté).
Sur firefox le problème se résoud facilement : un float:right et hop c'est la fin de la chaine qui est visible. Mais sur IE, le float:right ne marche que lorsque le div intérieur est plus petit que le conteneur. Aussitôt que le div intérieur (qui contient mon texte) est plus grand, le float:right ne change rien et le texte dépasse malgré tout sur la droite.
Petite précision, comme il peut y avoir beaucoup d'éléments à mon menu, il y a une taille au delà de laquelle le div du menu ne s'agrandit plus et une scroll apparait. Par conséquent il me faut une solution qui permette que les éléments restent dans le flux à cause de cette scroll.... Et oui... sinon avec des petites position absolute et right:0 ce serait pret depuis longtemps
Merci d'avance pour votre aide !
html :
<li class='asset'>
<div class='nom'>
<p>Un texte très long qui va dépasser de mon bouton et la date d'aujourd'hui est le 14 mai</p>
</div>
</li>
Inutile de poster le CSS, il s'agit simplement d'un float:right pour div.nom et les tailles qui sont définies.
Modifié par XIV-V (14 Nov 2008 - 14:26)