Also bei mir sind die schön untereinander...
Hi alxy,
wenn ich mir das unter jsfiddle.net ansehe, dann ist es bei mir zunächst auch untereinander. Hast du aber mal das Fenster "Result" horizontal größer gezogen, so dass der Text hinter /U1/ in eine einzige Zeile passt?
Bei mir sind dann auch wieder die (gelben) Kästen /U2/ und /U5/ nach rechts versetzt. Bei Dir etwa nicht?
Ich würde gerne verstehen, warum das so ist.
Ja, das habe ich auch schon irgendwo gelesen, dass eine ID nur einmal vorkommen darf. Weiß jetzt aber nicht in welchen Anwendungsfällen das gilt. Da steck ich nicht tief genug in der Materie drin.
Allerdings habe ich mein Beispiel mal umgestrickt und "class" statt "id" verwendet.
<!DOCTYPE html>
<html>
<head>
<title>Individualformat zur Darstellung eines Unterlagenverzeichnisses</title>
<style type="text/css">
<!--
* {
font-family:sans-serif;
}
-->
p.unr {
width:5em;
float:left;
background-color:yellow;
margin-top:0px;
text-align:center;
font-weight:bold;
<!-- font-family:sans-serif; -->
}p.txt {
margin-left:5em;
float:clear;
background-color:green;
margin-top:0px;
width:80%;
<!-- font-family:sans-serif; -->
}</style>
</head>
<body><p class="unr">/U1/</p>
<p class="txt">Ein erster Test, ob das auch so klappt, wie ich mir das vorstelle! </p>
<p class="unr">/U2/</p>
<p class="txt">Und dann gibt es hier noch eine zweite Zeile, mit der ich sehen möchte, wie das mit dem Zeilenumbruch so rüberkommt.</p><p class="unr">/U3/</p>
<p class="txt">Und dann gibt es hier noch eine zweite Zeile, mit der ich sehen
möchte, wie das mit dem Zeilenumbruch so rüberkommt.</p><p class="unr">/U4/</p>
<p class="txt">Ein erster Test, ob das auch so klappt, wie ich mir das vorstelle! </p><p class="unr">/U5/</p>
<p class="txt">Und dann gibt es hier noch eine zweite Zeile, mit der ich sehen
möchte, wie das mit dem Zeilenumbruch so rüberkommt.</p><p class="unr">/U6/</p>
<p class="txt">Und dann gibt es hier noch eine zweite Zeile, mit der ich sehen
möchte, wie das mit dem Zeilenumbruch so rüberkommt.</p></body>
</html>
Das Ergebnis sieht jedoch haargenau so aus. Daraus schließe ich, dass der Fehler woanders liegen muss. Also ist die Frage weiterhin offen.
Hallo, ich bin der Neue hier im Forum, und ich habe gleich mal eine Frage:
Ich möchte auf einer HTML-Seite ein Unterlagenverzeichnis erstellen, und das soll sinngemäß Folgendermaßen aussehen:
[FONT=courier new]/U1/ sdgkh hkf sd dsfkj dfsjkjksd sdfasf
/U2/ veviugh wefbiwuf wfigfif wfiwfbw dfiuwbfiuwebf
wbiwfwiuefb bwfiuewfie wfbiwfbwiebf wefiwefiwefw
/U3/ irwzrew wrhegogh rgorh woe trefwef hfow hgodg
sdigodhiosdhs sgiohg sdgodg odgf sdosdig [/FONT]
...Ich wollte das zuerst mit den bekannten HTML-Befehlen <ol><li>...</li>....</ol> realisieren, aber damit kriegt man ja nur so Standardsachen hin wie 1. 2. 3. oder A) B) C). Man kann aber nicht angeben, dass vor der "1" ein "/U" und nach der "1" statt dem "." ein "/" stehen soll.
Deshalb kam mir die Idee, das Ganze mit Hilfe von CSS zu machen.
Der zugehörige HTML-Code ist in der folgenden Box ersichtlich:
<!DOCTYPE html>
<html>
<head>
<title>Individualformat zur Darstellung eines Unterlagenverzeichnisses</title>
<style type="text/css">
<!--
* {
font-family:sans-serif;
}
-->
#unr {
width:5em;
float:left;
background-color:yellow;
margin-top:0px;
text-align:center;
font-weight:bold;
<!-- font-family:sans-serif; -->
}
#txt {
margin-left:5em;
float:clear;
background-color:green;
margin-top:0px;
width:80%;
<!-- font-family:sans-serif; -->
}
</style>
</head>
<body>
<p id="unr">/U1/</p>
<p id="txt">Ein erster Test, ob das auch so klappt, wie ich mir das vorstelle! </p>
<p id="unr">/U2/</p>
<p id="txt">Und dann gibt es hier noch eine zweite Zeile, mit der ich sehen möchte,
wie das mit dem Zeilenumbruch so rüberkommt.</p>
<p id="unr">/U3/</p>
<p id="txt">Und dann gibt es hier noch eine zweite Zeile, mit der ich sehen möchte,
wie das mit dem Zeilenumbruch so rüberkommt.</p>
<p id="unr">/U4/</p>
<p id="txt">Ein erster Test, ob das auch so klappt, wie ich mir das vorstelle! </p>
<p id="unr">/U5/</p>
<p id="txt">Und dann gibt es hier noch eine zweite Zeile, mit der ich sehen möchte,
wie das mit dem Zeilenumbruch so rüberkommt.</p>
<p id="unr">/U6/</p>
<p id="txt">Und dann gibt es hier noch eine zweite Zeile, mit der ich sehen möchte,
wie das mit dem Zeilenumbruch so rüberkommt.</p>
</body>
</html>Hiermit habe ich allerdings ein Problem, denn die /U1/, /U2/, /U3/ ... erscheinen nicht genau untereinander, wie man das eigentlich vermuten sollte, sondern für mich unvorhersehbar versetzt.
Mir fiel auf, dass erst dann das von mir gewünschte Aussehen erscheint, wenn ich das Browserfenster schmaler mache, dass sich alle Bereiche, die ich mit der id "txt" versehen habe, sich über mindestens zwei Zeilen erstrecken.
Die Reaktion ist in allen Browsern, mit denen ich das ausprobiert habe, identisch (Internet-Explorer7 und aktuelle Versionen von Google-Chrome, Firefox)
Ich habe mir schon die Finger wund gegoogelt und fleißig SelfHTML durchgesucht, aber ich bin immer noch auf der Suche nach der Lösung des Problems.
Kann mir jemand der Experten hier im Forum einen sachdienlichen Hinweis geben?
LG
Checkertaxi