Souligner sur une ligne

Bonjour,
J'aimerais souligner mon texte, sur une ligne tout marche bien, mais sur deux lignes, il souligne les deux lignes, comment éviter cela et faire en sorte qu'il ne souligne que la dernière ligne

html :

				<div class="syndic">
					<h2>Sur le Web</h2>
					<ul>
						
						<li><h3><a href="http://www.m-r.fr/">Agence de notation des médias </a><h3>
						<div class="chapo">En
collaboration avec des journalistes et des professionnels des médias,
cette structure indépendante a mis au point une méthodologie pour
évaluer la fiabilité des informations diffusées par les médias.</div></li>


<li><h3><a href="http://www.centpapiers.com/">Un titre de lien qui doit être long et qui pose probleme </a><h3>
						<div class="chapo">Média libre du Québec.</div></li>
						
						<li><h3><a href="http://www.centpapiers.com/">Cent papier </a><h3>
						<div class="chapo">Média libre du Québec.</div></li>
						
						<li><h3><a href="http://www.cuverville.org/">Cuverville </a><h3>
						<div class="chapo">Maison toulonnaise fondée en 1995.</div></li>
						
						<li><h3><a href="http://enrade.free.fr/">En rade </a><h3>
						<div class="chapo">Site d’informations satiriques et caustiques (Toulon).</div></li>
						
						<li><h3><a href="http://www.fakirpresse.info/">Fakir </a><h3>
						<div class="chapo">Ce journal n’est lié à aucun parti, aucun syndicat, aucune institution. Il est fâché avec tout le monde ou presque (Amiens).</div></li>
						
						<li><h3><a href="http://guidaltern.samizdat.net/">Guidaltern </a><h3>
						
						
						<li><h3><a href="http://www.indymedia.org/fr/">Indymedia </a><h3>
						<div class="chapo">Collectif
international et multiforme regroupant des médias indépendants et des
centaines de journalistes qui cherchent à offrir une couverture non
marchande de l’actualité sociale.</div></li>
						
						<li><h3><a href="http://www.infokiosques.net/">Infokiosques </a><h3>
						<div class="chapo">Brochures subversives à lire, imprimer, propager…</div></li>
						
						<li><h3><a href="http://www.lalettrealulu.com/">La Lettre à Lulu </a><h3>
						<div class="chapo">Le sale gosse de la presse nantaise.</div></li>
						
						<li><h3><a href="http://www.homme-moderne.org/">Le Magazine de l’Homme moderne</a><h3>
						
						
						<li><h3><a href="http://www.leravi.org/">Le Ravi </a><h3>
						<div class="chapo">Le mensuel régional qui a les mains libres (Marseille).</div></li>
						
					<li><h3><a href="http://www.satiricon.net/">Le Satiricon </a><h3>
						<div class="chapo">Lou journal des mémés qui aiment la castagne (Toulouse).</div></li>
						
	<li><h3><a href="http://www.peripheries.net/">Périphéries </a><h3>
						<div class="chapo">Créé
en 1998, Périphéries propose des rencontres avec des intellectuels et
des artistes, des reportages et des éditos à contre-courant. Il ne
s’interdit pas à l’occasion de brocarder certaines dérives médiatiques.</div></li>
						
					<li><h3><a href="http://rezo.net/">Rezo.net </a><h3>
						<div class="chapo">Le
portail incontournable du Net, ou «&nbsp;Portail des copains&nbsp;»,
qui permet de suivre en fil continu l’actualité des meilleurs sites
d’information indépendants de France et de Navarre.</div></li>
						
					<li><h3><a href="http://www.tocsin.net/">Tocsin </a><h3>
						<div class="chapo">Un éclairage sur les médias.</div></li>
					
	
					</ul>
				</div>

css :

/* syndication */
.syndic{
background:#ccc;
display:inline;
float:left;
margin:19px 0 0 2px;
padding:0 0 20px;
width:548px;
}

.syndic h3 {
border-bottom:1px dotted #840909;
text-align:left;
color:#840909;
font:bold 15px Arial, sans-serif;
margin:3px 5px 3px 0px;
padding:0;

}

.chapo {
color:#840909;
font:bold 12px Arial, sans-serif;
margin:3px 5px 3px 0px;
padding:0;
text-align:left;
text-transform:none;
}

.syndic h3 a {
border-bottom:1px dotted #840909;
color:#840909;
font:bold 15px Arial, sans-serif;
letter-spacing:2px;
margin:3px 5px 3px 0px;
padding:0;
text-align:left;
}

.syndic ul {
float:left;
font:12px Arial, sans-serif;
margin:0;
padding:10px 0 0 10px;
}

.syndic ul li {
color:#000;
list-style:none;
width:100%;
}


.syndic p {
color:#fff;
float:left;
font:12px Arial, sans-serif;
margin:0;
padding:0 10px;
}

.syndic p a {
color:#fff;
text-decoration:none;
}

Bonjour,

Je ne comprend pas trop le problème, car pour moi après avoir testé ton code sous firefox j'ai un rendu étrange et sous IE6 je pense que c'est le bon rendu que tu veux obtenir.

Et donc sous IE6 je n'ai pas deux ligne souligner donc je ne vois pas ton problème si tu peux mettre ta page en ligne, peut etre manque t'il quelque chose pour avoir le même problème que toi.

Bonjour,

Est-ce que tu as essayé avec une bordure (border-bottom) plutôt qu'avec text-decoration: underline?

Il y a aussi le pseudo-élément :first-line, ce qui te permettrait de faire:

p {text-decoration: none;}
p:first-line {text-decoration: underline;}

Par contre il n'y a pas de pseudo-élément :last-line en CSS 2.1 (ni en CSS 3, il me semble).