Trennlinie zwischen zwei Texten stets so lang wie der längere Text

NTDY

Erfahrenes Mitglied
Besitze ich zwei nebeneinanderliegende div-Boxen mit Text darin und möchte, dass die Trennlinie zwischen den beiden div-Boxen stets so lang ist, wie der längere Text in einer dieser div-Boxen, dann wende ich diesen "Trick" an.
Kennt jemand eine elegantere (ohne margin-left: -1px; ) Lösung?

HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>
.links, .rechts {
	width: 350px;
	float:left;
}
.links {
	border-right: #999 solid 1px;
	padding: 0 10px 0 0;
	margin-right: 0;
}

.rechts {
	border-left: #999 solid 1px;
	padding: 0 0 0 10px;
	margin-left: -1px;
}
</style>
</head>

<body>
	<div>
    	<div class="links">
<p>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
</p>
        </div>
        <div class="rechts">
<p>
Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.    
</p>      
        </div>
    </div>
</body>
</html>
 
Zurück