Abstand formatieren in Listen-Element

W

Webi

Angesehenes Mitglied
Hallo zusammen

Habe mal wieder ein CSS-Problem. Möchte in jeder Zeile das Datum und den nachfolgenden Text so formatieren, dass das Datum eine Länge von z.B. 50px und der Text eine Länge von 300px einnimmt. Wie kann ich das am einfachsten machen?


<ul style="list-style-type:none;">
<li><a href="xxx">14.4.2007 Text1Text1Text1Text1</a></li>
<li><a href="yyy">27.3.2007 Text2Text2Text2Text2</a></li>
</ul>

Danke und Gruss
Roland
 
Mein Vorschlag (ohne Garantie das es geht):


CODE
<ul style="list-style-type:none;">
<li><a href="xxx"><span class="datum">14.4.2007</span> <span class="text">Text1Text1Text1Text1</span></a></li>
<li><a href="yyy"><span class="datum">27.3.2007</span> <span class="text">Text2Text2Text2Text2</a></span></li>
</ul>




Und dazu dann das entsprechende CSS:

CODE
.datum {
width:50px;
}
.test {
width:300px;
}

 
so
CODE
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<ul xmlns="http://www.w3.org/1999/xhtml">

<head>
<title></title>
<meta name="GENERATOR" content="Quanta Plus" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
/* <![CDATA[ */
.abstand
{
line-height:35px;
}
/* ]]> */
</style>
</head>
<body>
<ul style="list-style-type:none;">
<li class='abstand'><a href="xxx"><span class="datum">14.4.2007</span> <span class="text">Text1Text1Text1Text1</span></a></li>
<li class='abstand'><a href="yyy"><span class="datum">27.3.2007</span> <span class="text">Text2Text2Text2Text2</a></span></li>
</ul>

</body>
</html>



oder so

CODE
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title></title>
<meta name="GENERATOR" content="Quanta Plus" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
/* <![CDATA[ */
#abstand
{
line-height:45px;
}
/* ]]> */
</style>
</head>
<body>
<ul id='abstand'>
<li> sadfasf </li>
<li> asdfasf</li>
<li> fdsasfd </li>
</ul>

</body>
</html>


gruss
Antoine


PS: Das Zauberwort heisst 'line-height:Anzahl px'
 
Sie müssen sich einloggen oder registrieren, um hier antworten zu können.
Zurück
Oben