nicht angemeldet
Textelement in ein anderes stecken und dort mit padding oder hier mit margin arbeiten.
- Wenn ich Span den Hintergrund und margin oder P padding gebe, wird das Span nur weiter vom Rand des P dargestellt - sein Hintergrund aber natuerlich nicht.
Achso, du möchtest, dass der Zeilenhintergrund bis zum Rand geht, der Zeileninhalt aber nicht.
Zwei float-Elemente, eins links, eins rechts, in Höhe des Textelements:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Test</title>
<style type="text/css">
p.test {
display:inline;
border:1px solid red;
background-color:#ccc;
line-height:2em;
}
span#links {
float:left;
border:1px solid #0f0;
}
span#rechts {
float:right;
border:1px solid #00f;
}
span.innenrand {
width:10em;
line-height:80em;
/* top und bottom wollen nicht so recht */
}
body {
width:800px;
}
</style>
<body>
<p class="test">
<span id="links" class="innenrand">Links</span>
<span id="rechts" class="innenrand">Rechts</span>
Dies ist ein Blindtext. Bitte beachten Sie den weiteren Inhalt dieses Textes nicht. Es handelt sich tatsächlich, so war mir Gott helfe, nur um einen Blindtext. Ja ja, ich merke schon, Sie können es wohl nicht lassen. Na gut, dann erzähle ich jetzt einen Witz: Wie viele Blondinen braucht man, um eine Glühbirne zu wechseln? Fünf, eine, die die Glühbirne hält, und vier, die das Zimmer drehen. Soso, jetzt lachen Sie auch noch, wo ich doch ausdrücklich darauf hingewiesen hatte, den Text überhaupt nicht weiter zu lesen.
</p>
</body></html>
Die Höhe der Randelemente ist noch fest. Entweder probierst du, die Elemente anders zu platzieren, um eventuell mit top und bottom arbeiten zu können, oder du passt ihre Höhe in regelmäßigen Abständen mit Javascript an.
Gernot Back