nicht angemeldet
Zeilenumbruch verhindern
0 
Gernot Back
0 0 0 Gernot Back
0 0 0 Gernot Back
0 0 Gernot Back
0
Zeilenumbruch verhindern
Der MartinHallo,
ich habe eine Liste und nach jedem Eintrag soll eine rechtsbündige Unterschrift folgen. Ich versuche es so:
<ul>
<li>Text1</li>
<div align="right">Unterschrift1</div>
<li>Text2</li>
<div align="right">Unterschrift2</div>
<li>Text3</li>
<div align="right">Unterschrift3</div>
</ul>
Ich erhalte aber nach jeder Unterschrift eine Leerzeile, die ich verhindern möchte. Ich habe versucht, das über CSS zu lösen mit display:inline, jedoch wurde dabei das angegebene text-align:right ignoriert. Kann mir jemand helfen, eine Lösung zu finden? Ich probiere das schon seit Stunden und weiss nicht weiter. Danke
-
Hallo MWeltring,
<ul>
<li>Text1</li>
<div align="right">Unterschrift1</div>
<li>Text2</li>
<div align="right">Unterschrift2</div>
<li>Text3</li>
<div align="right">Unterschrift3</div>
</ul>In einer Liste (OL-Element, UL-Element) haben andere als LI-Elemente nichts als direkte Kindelemente verloren, du kannst aber DIV- oder sonstige Elemente innerhalb der LI-Elemente (qausi als Enkelkinder) der Liste unterbringen.
Ich erhalte aber nach jeder Unterschrift eine Leerzeile, die ich verhindern möchte. Ich habe versucht, das über CSS zu lösen mit display:inline, jedoch wurde dabei das angegebene text-align:right ignoriert.
Nutze stattdessen float.
Gruß Gernot
-
Nutze stattdessen float.
Gruß Gernot
Hallo Gernot,
danke für den Tip. Ich habs mit dem float auch probiert, aber es will nicht klappen, dass ich beides hinkriege. Wie müsste denn das richtig aussehen, hilfst mir noch mal?
Danke, Martina
-
Bin nicht sicher, ob ich richtig verstanden wurde. So sollte es aussehen:
1. Zeile Text1 linksbündig
2. Zeile Unterschrift 1 rechtsbündig
3. Zeile Text2 linksbündig
4. Zeile Unterschrift 2 rechtsbündig
5. Zeile Text3 linksbündig
6. Zeile Unterschrift 3 rechtsbündigdazwischen keine Leerzeilen.
Gruß Martina
-
Hallo,
Bin nicht sicher, ob ich richtig verstanden wurde. So sollte es aussehen:
- Zeile Text1 linksbündig
- Zeile Unterschrift 1 rechtsbündig
- Zeile Text2 linksbündig
- Zeile Unterschrift 2 rechtsbündig
- Zeile Text3 linksbündig
- Zeile Unterschrift 3 rechtsbündig
dazwischen keine Leerzeilen.
Welcher Zusammenhang besteht inhaltlich zwischen Text und Unterschrift? Muss das wirklich eine UL-Liste sein?
Es sieht mir eher nach einer DL-Liste aus. Hier hast Du dann DT- und DD-Elemente, an denen CSS angreifen kann.
viele Grüße
Axel
-
Es sieht mir eher nach einer DL-Liste aus. Hier hast Du dann DT- und DD-Elemente, an denen CSS angreifen kann.
viele Grüße
Axel
Danke Axel, aber es soll beim Text der Circle auftauchen und darunter rechtsbündig ein Paragraph (aus einem Gesetzbuch) zur Anzeige, woher der obige Text stammt.
-
Hallo,
aber es soll beim Text der Circle auftauchen und darunter rechtsbündig ein Paragraph (aus einem Gesetzbuch) zur Anzeige, woher der obige Text stammt.
Ja, also ist die Struktur doch klar:
UL/LI mit Text und im LI ein P (Paragraph)und das CSS auch:
LI mit list-style-type:circle
P mit text-align:rightSo etwa:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Liste</title> <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"> <style type="text/css"> <!-- ul {margin:0; padding:0; padding-left:1em; width:72ex; margin-left:auto; margin-right:auto; background-color:#00FFAF;} ul li {list-style-type:circle; } ul p {margin:0; padding:0; text-align:right;} --> </style> </head> <body> <ul> <li>Text 1 <p>Unterschrift 1</p> </li> <li>Text 2 <p>Unterschrift 2</p> </li> <li>Text 3 <p>Unterschrift 3</p> </li> </ul> </body> </html>viele Grüße
Axel
-
Hallo Axel.
So etwa:
[…]
<li>Text 1
<p>Unterschrift 1</p>
</li>
[…]Wobei ich hier dazu tendieren würde, an Stelle eines Absatzes (p) wirklich eine Überschrift (hX) zu nutzen.
Einen schönen Sonntag noch.
Gruß, Ashura
--
sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
„It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
[HTML Design Constraints: Logical Markup]-
Hallo,
Wobei ich hier dazu tendieren würde, an Stelle eines Absatzes (p) wirklich eine Überschrift (hX) zu nutzen.
Nach nochmaligem Lesen, tendiere ich jetzt eher zu:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Liste</title> <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"> <style type="text/css"> <!-- ul {margin:0; padding:0; padding-left:1em; width:72ex; margin-left:auto; margin-right:auto; background-color:#00FFAF;} ul li {list-style-type:circle; } ul cite {margin:0; padding:0; display:block; text-align:right;} --> </style> </head> <body> <ul> <li>... Wer vorsätzlich oder fahrlässig das Leben, den Körper, die Gesundheit, die Freiheit, das Eigentum oder ein sonstiges Recht eines anderen widerrechtlich verletzt, ist dem anderen zum Ersatz des daraus entstehenden Schadens verpflichtet... <cite>BGB § 823</cite> </li> <li>... Wer in einem der in den §§ 823 bis 826 bezeichneten Fälle für einen von ihm verursachten Schaden auf Grund der §§ 827, 828 nicht verantwortlich ist, hat gleichwohl, sofern der Ersatz des Schadens nicht von einem aufsichtspflichtigen Dritten erlangt werden kann, den Schaden insoweit zu ersetzen, als die Billigkeit nach den Umständen, insbesondere nach den Verhältnissen der Beteiligten, eine Schadloshaltung erfordert und ihm nicht die Mittel entzogen werden, deren er zum angemessenen Unterhalt sowie zur Erfüllung seiner gesetzlichen Unterhaltspflichten bedarf... <cite>BGB § 829</cite> </li> </ul> </body> </html>viele Grüße ;-)
Ax*WasSindWirHeuteWiederSemantisch*el
-
Hallo Axel.
Nach nochmaligem Lesen, tendiere ich jetzt eher zu:
[…]
Da hast du allerdings völlig Recht, wie heraus erkennbar ist.
Ax*WasSindWirHeuteWiederSemantisch*el
Naja, wenn dann richtig.
Einen schönen Sonntag noch.
Gruß, Ashura
--
sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
„It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
[HTML Design Constraints: Logical Markup]
-
-
-
Vielen Dank, Axel, das klappt. Nun brauche ich noch eine Weile, um das alles zu verstehen und rauszufinden, wo mein Problem lag. Ich melde mich wieder.
Gruß
Martina-
Hallo,
Nun brauche ich noch eine Weile, um das alles zu verstehen und rauszufinden, wo mein Problem lag.
In der falschen HTML-Elementschachtelung und da, wo es bei CSS-Beginnern immer liegt, bei margin und padding.
viele Grüße
Axel
-
-
-
-
-
-
Hi,
<ul>
<li>Text1</li>
<div align="right">Unterschrift1</div>ul darf nur li als Kindelement enthalten; so geht's also überhaupt nicht.
<li><p>Textinfo</p><dfn>Erklärungsunterschrift</dfn></li>
wäre eine zulässige und je nach Inhalt sinnvolle Textauszeichnung.freundliche Grüße
Ingo-
Hi,
<ul>
<li>Text1</li>
<div align="right">Unterschrift1</div>ul darf nur li als Kindelement enthalten; so geht's also überhaupt nicht.
<li><p>Textinfo</p><dfn>Erklärungsunterschrift</dfn></li>
wäre eine zulässige und je nach Inhalt sinnvolle Textauszeichnung.freundliche Grüße
IngoDanke, Ingo. Aber, wie kriege ich nun beides unter einen Hut: Keine Leerzeile und rechtsbündig? Ist das mit HTML allein lösbar?
-
Hallo MWeltring,
<li><p>Textinfo</p><dfn>Erklärungsunterschrift</dfn></li>
wäre eine zulässige und je nach Inhalt sinnvolle Textauszeichnung.Keine Leerzeile und rechtsbündig? Ist das mit HTML allein lösbar?
Nein, aber in Kombination mit CSS, dem Thema, zu dem du hier ja auch postest, sollte das doch kein Problem sein:
Das LI- und das P-Element haben text-align:left, aber das ist ja bei deinem Dokument wahrscheinlich auch der Default-Wert und ist deshalb entbehrlich und das DFN-Element oder ein anderes deiner Wahl, je nachdem ob es sich bei deiner Bildunterschrift tatsächlich um eine Definition oder um etwas anderes handelt, lässt du rechts floaten.
Gruß Gernot
-
Hi,
das DFN-Element oder ein anderes deiner Wahl, je nachdem ob es sich bei deiner Bildunterschrift tatsächlich um eine Definition oder um etwas anderes handelt, lässt du rechts floaten.
warum so kompliziert? text-align kennt auch den Wert right. ;-)
Ggfls. noch auf display:block setzen.freundliche Grüße
Ingo-
Hi,
das DFN-Element oder ein anderes deiner Wahl, je nachdem ob es sich bei deiner Bildunterschrift tatsächlich um eine Definition oder um etwas anderes handelt, lässt du rechts floaten.
warum so kompliziert? text-align kennt auch den Wert right. ;-)
Ggfls. noch auf display:block setzen.freundliche Grüße
IngoDanke, Ingo,
damit sind aber die Leerzeilen nach der Unterschrift immer noch da:
<ul>
<li>Text1</li>
<dfn style="text-align:right; display:block;">Unterschrift1</dfn>
</li>
</ul>So sicher nicht?
Martina
-
Hallo MWeltring,
damit sind aber die Leerzeilen nach der Unterschrift immer noch da:
<ul>
<li>Text1</li>
<dfn style="text-align:right; display:block;">Unterschrift1</dfn>
</li>
</ul>also mit Rücksicht auf den IE, in dem du dir das wahrscheinlich betrachtest (als ob es keine Browser gäbe!) musst du evtl doch die Lösung mit float nehmen, vorher stell aber auch für den IE sicher, dass du nicht mehr schließende </li>-Tags hast als öffnende <li>-Tags und beherzige auch das vorher Gesagte, wonach ein UL-Element nichts anderes als LI-Elemente als direkte Kinder haben darf.
Gruß Gernot
-
also mit Rücksicht auf den IE, in dem du dir das wahrscheinlich betrachtest (als ob es keine Browser gäbe!) musst du evtl doch die Lösung mit float nehmen, vorher stell aber auch für den IE sicher, dass du nicht mehr schließende </li>-Tags hast als öffnende <li>-Tags und beherzige auch das vorher Gesagte, wonach ein UL-Element nichts anderes als LI-Elemente als direkte Kinder haben darf.
Gruß Gernot
Hallo Gernot,
ich habe mich in der Aufregung vertippt, sorry. Es sieht tatsächlich so aus:
<ul>
<li>Text1</li>
<dfn style="text-align:right; display:block;">Unterschrift1</dfn>
</ul>Da war ein li zuviel, aber nur hier. Ich verstehe auch nicht, wodurch hierbei die Leerzeilen verschwinden sollen?
Egal welcher Browser, die Anzeige sollte überall gleich sein. Das wird später auch getestet.
Gruß
Martina-
Hallo MWeltring,
ich habe mich in der Aufregung vertippt, sorry. Es sieht tatsächlich so aus:
<ul>
<li>Text1</li>
<dfn style="text-align:right; display:block;">Unterschrift1</dfn>
</ul>Es soll aber so aussehen:
<ul> <li>Text1 <dfn>Unterschrift1</dfn> </li> </ul>Sonst ist ja das DFN-Element direktes Kind des UL-Elements. Erlaubt ist es aber nur ab der übernächsten Generation, als frühestens als Enkel.
Gruß Gernot
-
Sonst ist ja das DFN-Element direktes Kind des UL-Elements. Erlaubt ist es aber nur ab der übernächsten Generation, als frühestens als Enkel.
Gruß Gernot
lach, danke Gernot. Ich habe es nun verstanden. Sorry, habe selbst keine Kinder ;-)
Danke für den Vererbungs,Kurs !
Martina
-
Hallo MWeltring,
lach, danke Gernot. Ich habe es nun verstanden. Sorry, habe selbst keine Kinder ;-)
Ich verrate dir jetzt mal ein Geheimnis:
Mit Kindern und genetischer Vererbung habe ich auch überhaupt keine eigene Erfahrung und bin mir auch recht sicher, dass sich das in Zukunft nicht ändern wird.
;-)
Gruß Gernot
-
Hallo Gernot,
Ich verrate dir jetzt mal ein Geheimnis:
Mit Kindern und genetischer Vererbung habe ich auch überhaupt keine eigene Erfahrung und bin mir auch recht sicher, dass sich das in Zukunft nicht ändern wird.Das glaub' ich dir aufs Wort. :-)
Schönen Sonntag noch,
Martin--
Niemand lebt allein von seinen Träumen.
Aber wer träumt, lebt noch.
-
-
-
-
-
-
-
-
Das LI- und das P-Element haben text-align:left, aber das ist ja bei deinem Dokument wahrscheinlich auch der Default-Wert und ist deshalb entbehrlich und das DFN-Element oder ein anderes deiner Wahl, je nachdem ob es sich bei deiner Bildunterschrift tatsächlich um eine Definition oder um etwas anderes handelt, lässt du rechts floaten.
Gruß Gernot
Nochmals danke, Gernot. sorry, bin recht am Verzweifeln und bekam hier schon Ärger.
Float habe ich versucht, aber es macht mir einen Textumfluss, den ich aber nicht will. Gibt es da nicht was anderes oder wende ich float falsch an?
Gruß
Martina-
Hallo MWeltring.
sorry, bin recht am Verzweifeln und bekam hier schon Ärger.
Wieso Ärger?
Ich habe dich in einem neutralen Tonfall darauf hingewiesen, dass ein neuer Thread gänzlich überflüssig ist, da mir ersichtlich war, dass dir hier bereits bestens geholfen wird.Einen schönen Sonntag noch.
Gruß, Ashura
--
sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
„It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
[HTML Design Constraints: Logical Markup]-
Hallo MWeltring.
sorry, bin recht am Verzweifeln und bekam hier schon Ärger.
Wieso Ärger?
Ich habe dich in einem neutralen Tonfall darauf hingewiesen, dass ein neuer Thread gänzlich überflüssig ist, da mir ersichtlich war, dass dir hier bereits bestens geholfen wird.Einen schönen Sonntag noch.
Gruß, Ashura
Ich hab doch auch nix gegen den Tonfal gesagt... kein Fehlgriff, ist ok, aber Ärger ist es ja, den ich machte und nochmals sorry für den Ärger. Nicht bös sein.
-
-
-
-
-