28173 sujets

CSS et mise en forme, CSS3

[résolu] Justifier une seule ligne ?

Bonjour à tous,

Je cherche comment justifier une ligne de texte (dans un <p> ou non, cela n'a pas d'importance), mais une seule ligne...

J'ai remarqué l'existence de "text-justify:inter-cluster", mais cela ne fonctionne que sur IE...

La méthode qui consiste à ajouter plein d'espaces insécables (des &nbsp; par dizaines) n'est pas très propre et bugge quand on augmente la taille du texte...

Bref, je ne sais que faire...

Si vous avez une idée...

Merci !

Pierre
Modifié par horse_pyro (14 Jun 2007 - 15:47)
Bonjour

Il existe la pseudo class :first-line qui est faite pour cela. Seul hic il me semble que ca marche pas bien sur IE à cause du fait que ce navigateur le réclame sur un lien <a>


p:first-line {
   text-align:justify;
}

Modifié par zzzazzz (13 Jun 2007 - 17:35)
Bonjour,

Et avec un <span> ça ne le fait pas ?
<style type="text/css">
	#conteneur{
	width: 500px;
	border: 1px solid black;
	}

	p{ 
 	text-align: left;
	}
	
	span{
	display: block;	
	text-align: justify;
	color: red;
	}
</style>
</head>
<body>
<div id="conteneur">
	<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed auctor. Sed eu magna. Ut bibendum. Fusce sit amet justo non tellus porta rhoncus. Sed non felis ut mauris laoreet pulvinar. Sed eu mi. Fusce pretium. Donec sit amet nunc. Aliquam erat volutpat. Cras risus. Nunc imperdiet sollicitudin turpis. Nulla erat turpis, faucibus at, tempor vel, sagittis vitae, augue. Vestibulum a tellus eu felis porttitor elementum. Proin consequat commodo nibh.<br />
 <span>
risus dui, congue pharetra, consectetuer non, pretium nec, mi. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Morbi placerat. Praesent imperdiet, nisi nec aliquet congue, sapien lectus placerat nunc, sit amet semper ipsum nibh eget sapien. Mauris et ipsum. Nullam ultricies ligula a sem. Proin nec ipsum
	Fusce pretium. Donec sit amet nunc. Aliquam erat volutpat. Cras risus. Nunc imperdiet sollicitudin turpis. Nulla erat turpis, faucibus at, tempor vel, sagittis vitae, augue. 
</span>
<br />
	Vestibulum a tellus eu felis porttitor elementum. Proin consequat commodo nibh.
	</p>
</div>
Bonjour,

En fait, je me suis mal exprimé dans mon premier post : je cherche à justifier texte d'une seule ligne

Plus précisément, j'ai 3 liens textuels dans une div, et je voudrais qu'ils soient equidistants dans cette div (ie le premier lien contre le bord gauche de la div, le second lien au milieu, et le 3e contre le bord droit...).

Ces trois liens mis bouts à bouts sont plus petits que la largeur de la div, text-align:justify ne fait donc rien. Smiley ohwell

Je ne sais donc pas trop comment faire...

[edit : peut être qu'avec un positionnement en flottant, on pourrait faire quelquechose ? J'ai pas encore tout compris à propos de :float, donc si ça se trouve, je suis en train de dire n'importe quoi, mais bon Smiley cligne ]

Merci

Pierre

(PS : très sympa ton avatar, Ghost... cela fait 2-3 mois que je me suis mis à la création d'un site, et le shadok illustre bien mon état d'esprit parfois Smiley biggrin )
Modifié par horse_pyro (14 Jun 2007 - 15:24)
Oui je pense qu'il faut plutôt se tourner vers les float. Celui de gauche en float:left, celui de droite en float:right, et le dernier sans rien (mais son parent avec un text-align:center)

Par contre tu seras obligé dans ton code html de mettre le lien du milieu en dernier.
Merci !

Avec les float, c'est parfait !

Merci beaucoup !

Encore quelques semaines (pas trop quand même j'espère), et je posterai l'adresse du site pour avoir vos avis/critiques/remarques...

A bientôt, et encore merci.

Pierre
Sujet clos
Aller à