5568 sujets

Sémantique web et HTML

[résolu] Label qui "dépasse" du fieldset

Bonjour !

J'ai un petit problème avec les labels sur radio bouton. Soit un formulaire liste :

<form id='ListeRight' method='post' action=/c4m/index.php?rubrique=news>
	<fieldset>
		<legend>
			Liste des news
		</legend>
		<ul>
			<li>
				<label>
					<input class='radio' type='radio' name='news_id' value=2 />
					Label court
				</label>
			</li>
			<li>
				<label>
					<input class='radio' type='radio' name='news_id' value=5 />
					Label Long très long très très long.............
				</label>
			</li>

		</ul>
		<input  type='submit' name='btn_show' value='Afficher'>
		<input  type='submit' name='btn_del' value='Supprimer'>
	</fieldset>
</form>

C'est une liste qui s'affiche à droite du formulaire de saisie (float:right).
Elle est généré à partir de php et affiche les différents éléments modifiable. Bref le concept fonctionne j'ai juste un pb lorsque le label est trop long. En effet il dépasse du formulaire & fieldset. J'ai essayé en spécifiant un width et max-width au label, puis au formulaire, puis au fieldset...j'ai essayé en mélangeant le tout, mais pas moyen: si le label est trop long il dépasse...
je souhaite que le label s'affiche sur plusieurs ligne si il est trop long ... avez-vous une idée ?
merci
je pense avoir résolu mon pb. A priori on ne peu pas revenir à la ligne si le label ne comporte pas de caractère "espace", et qu'il dépasse la taille qui lui est affecté. J'aimerai cependant savoir si l'un de vous ne connais pas un moyen de contourner celà.
je m'explique :
(pour note j'ai supprimé la balise label cité ci-dessus, qui n'était d'aucune utilité)

A. voici un exemple de la liste s'affichant correctement :
http://seithein.free.fr/test/test.html
le label de la liste est formé de mots courts, par conséquent il s'affiche correctement

B. affichage incorrecte
http://seithein.free.fr/test/test1.html
Le label étant trop long il dépasse de la zone de formulaire&fieldset (sous mozilla). ou décalle carrément la liste sous IE.

biensure le mot dans l'exemple est vraiment très long. J'ai définit une taille suffisament grande pour la liste, de façon a pouvoir afficher n'importe quel mot de la langue française. Donc pour ce cas précis, mon problème est résoulu.
Par contre si l'espace de ma liste est plus restreint, ca peu etre le cas pour un menu horizontal le pb ce pose à nouveau.
Question 1 : N'y a t'il donc aucun moyen de forcer un label a ne pas depasser la taille qui lui est affecté ?

Question 2 : Dans le même genre, si j'ai un paragraphe (<p>) et que je lui affecte une hauteur minimun il n'en tient pas compte et se base sa hauteur en fonction du texte. Le seul moyen que j'ai trouvé c'est de l'entouré d'un div, mais apres ca en fait bcp des div. La balise p est pourtant une balise de type bloc comme div, non ?
Modifié le 29 Dec 2004 - 02:36
En effet c'est a peu près ce que je pensais, il n'existe pas de solution miracle.
Ce n'est pas possible de couper un mot et de revenir à la ligne si ce dernier ne contient pas d'espace.

C'est vrai que l'overflow est une solution acceptable. Positionné en hidden sur la balise <li> il évite le décallage du bloc liste sous ie. Les comportements de IE et Mozilla sont différents mais ca reste la meilleur solution....
merci !
Modifié le 05 Jan 2005 - 19:11
Bon, c'est à moitié du flood, mais je suis très content d'avoir pu aider quelqu'un, moi qui me fait plus souvent aider qu'autre chose.
Sujet clos
Aller à