nicht angemeldet
Gunnar Bittersmann@@molily:
nuqneH
Markup:
<!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" xml:lang="de" lang="de">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>TEST</title>
<link rel="stylesheet" type="text/css" href="test.css"/>
</head>
<body>
<h1>Allgemeine Erklärung der Menschenrechte</h1>
<dl>
<dt>Artikel 1</dt>
<dd>Alle Menschen sind frei und gleich an Würde und Rechten geboren. Sie sind mit Vernunft und Gewissen begabt und sollen einander im Geist der Brüderlichkeit begegnen.</dd>
<dt>Artikel 2</dt>
<dd>Jeder hat Anspruch auf die in dieser Erklärung verkündeten Rechte und Freiheiten ohne irgendeinen Unterschied, etwa nach Rasse, Hautfarbe, Geschlecht, Sprache, Religion, politischer oder sonstiger Überzeugung, nationaler oder sozialer Herkunft, Vermögen, Geburt oder sonstigem Stand.</dd>
<dd>Des weiteren darf kein Unterschied gemacht werden auf Grund der politischen, rechtlichen oder internationalen Stellung des Landes oder Gebiets, dem eine Person angehört, gleichgültig ob dieses unabhängig ist, unter Treuhandschaft steht, keine Selbstregierung besitzt oder sonst in seiner Souveränität eingeschränkt ist.</dd>
<dt>Artikel 3</dt>
<dd>Jeder hat das Recht auf Leben, Freiheit und Sicherheit der Person.</dd>
</dl>
</body>
</html>
Stylesheet (die Anstriche bei den 'dd' spar ich mir jetzt mal):
dt
{
float: left;
}
dd
{
margin: 1em 0 1em 6em;
}
Welche Probleme siehst bzw. erwartest du da?
IE 6, IE 6 und, als wäre es noch nicht genug, zu allem Überfluss auch noch IE 6.
*g*
In der Tat, IE 6 rückt die erste Zeile des Texts im ersten 'dd' nach einem 'dt' etwas ein.
Abhilfe: keine Floats, sondern 'dt' per absoluter Positionierung aus dem Fluss nehmen:
dt
{
position: absolute;
left: 10px;
}
dd
{
margin: 1em 0 1em 6em;
}
Problem: Opera stellt die 'dt' ab dem zweiten zu hoch dar. Anstatt das für Opera hinzufrickeln, belassen wir’s bei den Floats und nehmen die Lösung mit absoluter Positionierung nur für IE < 7:
dt
{
float: left;
}
* html dt
{
position: absolute;
left: 10px;
}
dd
{
margin: 1em 0 1em 6em;
}
Vielleicht postet mal einer eine browserübergreifende Lösung - also nicht nur ein HTML-Gerüst.
Naja, eher eine Doppellösung als EINE browserübergreifende – aber es funzt[tm].
Qapla'
Bildung lässt sich nicht downloaden. (Günther Jauch)