Supportnet / Forum / Webseiten/HTML
Listen-Einzug per CSS definieren
Frage
Hallo,
kann man bei der Formatierung von Listen per CSS den "grundsätzlichen" Einzug (nicht einen ev. zusätzlichen; das geht mit [code] text-indent:1em;[/code]) festlegen (=verringern) ?
Oder regelt das der individuelle Browser?
In Selfhtml hab ich dazu leider nix gefunden (oder ich steh wieder mal auf der Leitung...)
Danke für Tipps
Mich
Antwort 1 von Friedel
Es wäre wphl einfacher gewesen das aus zu probieren. Aber natürlich geht das. Dazu ist dieses Attribut doch da.
Antwort 2 von Mich
Hallo Friedel,
wie soll ich es denn ausprobieren, wenn ich nicht weiß, welche CSS-Definition ich benutzen muß. Danach frage ich ja hier
das ist schön ! Wie ?
???
Damit wir nicht aneinander vorbeireden: Ich möchte die Breite des Einzugs auf eine bestimmte Pixel-Zahl festlegen.
Gruß
Mich
Zitat:
Es wäre wphl einfacher gewesen das aus zu probieren
Es wäre wphl einfacher gewesen das aus zu probieren
wie soll ich es denn ausprobieren, wenn ich nicht weiß, welche CSS-Definition ich benutzen muß. Danach frage ich ja hier
Zitat:
Aber natürlich geht das.
Aber natürlich geht das.
das ist schön ! Wie ?
Zitat:
Dazu ist dieses Attribut doch da.
Dazu ist dieses Attribut doch da.
???
Damit wir nicht aneinander vorbeireden: Ich möchte die Breite des Einzugs auf eine bestimmte Pixel-Zahl festlegen.
Gruß
Mich
Antwort 3 von Friedel
Und wo ist das Problem? Du weißt welche Attribut di verwenden musst/willst. Also verwende es.
Antwort 4 von Mich
Wenn ich es wüßte, würde ich nicht fragen...
Wo gebe ich denn zum Beispiel an, daß die Einrückung der Liste 3 Pixel betragen soll.
Gruß
Mich
Wo gebe ich denn zum Beispiel an, daß die Einrückung der Liste 3 Pixel betragen soll.
Gruß
Mich
Antwort 5 von rfb
Meiner Erfahrung nach interpretieren die Browser das sehr unterschiedlich - mal relativ zum Browserdefaultwert, mal absolut. Hier bleibt nur im Experiment einen Kompromiss zu suchen und auf IE7 zu hoffen (mit dem IE6 hatte ich die seltsamsten Ergebnisse)
Soweit ich das sehe gibt es nicht mal einen Vorgabewert im W3C-Basis-CSS für <li>, siehe http://www.w3.org/TR/REC-CSS2/sample.html
Soweit ich das sehe gibt es nicht mal einen Vorgabewert im W3C-Basis-CSS für <li>, siehe http://www.w3.org/TR/REC-CSS2/sample.html
Antwort 6 von Friedel
@rfb: ??? Ich kenne keinen Browser, der einen Defaultwert verwendet, der nicht 0 ist. Natürlich verwendet auch der IE6 einen Erstzeileneinzug von 0.
@Mich: Sorry, aber vielleicht stehe ich auf der Leitung. Ich weiß immer noch nicht, wo dein Problem ist. Wenn du statt 1em lieber 3px verwenden willst, dann hindert dich doch nichts daran. Du brauchst doch nur 1em durch 3px zu ersetzen.
Dieses Beispiel erzeugt eine ungeordnete Liste, bei der die erste zeile von jedem Listenpunkt 10 Pixel eingerückt ist und wo die ganze Liste 20 Pixel eingerückt ist.. Natürlich sieht man den Erstzeileneinzug nur, wenn du "viel Text" durch viel Text ersetzt, damit es mehere Zeilen gibt.
@Mich: Sorry, aber vielleicht stehe ich auf der Leitung. Ich weiß immer noch nicht, wo dein Problem ist. Wenn du statt 1em lieber 3px verwenden willst, dann hindert dich doch nichts daran. Du brauchst doch nur 1em durch 3px zu ersetzen.
<ul style="margin-left:20px; text-indent:10px;">
<li>viel Text </li>
<li>viel Text </li>
<li>viel Text </li>
</ul>
Dieses Beispiel erzeugt eine ungeordnete Liste, bei der die erste zeile von jedem Listenpunkt 10 Pixel eingerückt ist und wo die ganze Liste 20 Pixel eingerückt ist.. Natürlich sieht man den Erstzeileneinzug nur, wenn du "viel Text" durch viel Text ersetzt, damit es mehere Zeilen gibt.
Antwort 7 von rfb
@Friedel:
Erstzeileneinzug? Ich hatte die Frage nach dem Einzug der Absätze in der Liste generell interpretiert.
Wenn ich mir dies ansehe (http://de.selfhtml.org/html/text/anzeige/ul.htm), also eine Liste ohne CSS-Beeinflussung, dann sind alle Absätze und Punkte weit weg vom üblichen Rand.
Und dieser Abstand schwankt von Browser zu Browser. Wenn du mit margin-left daran etwas änderst ist es manchmal recht erstaunlich, wo die Listenpunkte (die kleinen Kreise, Quadrate, etc) landen.
Erstzeileneinzug? Ich hatte die Frage nach dem Einzug der Absätze in der Liste generell interpretiert.
Wenn ich mir dies ansehe (http://de.selfhtml.org/html/text/anzeige/ul.htm), also eine Liste ohne CSS-Beeinflussung, dann sind alle Absätze und Punkte weit weg vom üblichen Rand.
Und dieser Abstand schwankt von Browser zu Browser. Wenn du mit margin-left daran etwas änderst ist es manchmal recht erstaunlich, wo die Listenpunkte (die kleinen Kreise, Quadrate, etc) landen.
Antwort 8 von Mich
Hallo,
wie ich ja schrieb, meinte ich den Einzug generell.
Gruß
Mich
wie ich ja schrieb, meinte ich den Einzug generell.
Gruß
Mich
Antwort 9 von schubbidubbidu
macht man das nicht so?
ul {
margin:0px;
padding:0px;
}
ul {
margin:0px;
padding:0px;
}
Antwort 10 von rfb
Zitat:
macht man das nicht so?
ja, so kann man das machen.macht man das nicht so?
Setz das mal in das Beispiel in A7 und erhöhe schrittweise margin, achte auf die Aufzählungszeichen, dann wirst du in den versch. Browsern (Opera, Firefox, IE) sehen, was ich meine.
Antwort 11 von schubbidubbidu
ich verstehe!
dann macht man eben das:
und html das:
wobei die betonung auf "-" (minus) liegt!
:-)
dann macht man eben das:
ul {
margin:0px;
padding:0px;
text-decoration:none;
}
und html das:
<li>- Karotten</li>
<li>- Kondome</li>
<li>- Karl Marx</li>wobei die betonung auf "-" (minus) liegt!
:-)
Antwort 12 von rfb
wozu text-decoration:none; ???
Das per CSS-margin ins Unsichtbare geschickte Aufzählungszeichen durch ein - zu ersetzen halte ich für eine ziemlich ungeschickte Methode. Schon wenn du mal das Autoren-CSS deaktivierst oder einschränkst sieht das Ergebnis ziemlich dämlich aus. Und beim Vorlesen-lassen der Seite hört es sich auch so an ("Listeneintrag: minus Karotten. Listeneintrag: minus Kondome, ...").
Das per CSS-margin ins Unsichtbare geschickte Aufzählungszeichen durch ein - zu ersetzen halte ich für eine ziemlich ungeschickte Methode. Schon wenn du mal das Autoren-CSS deaktivierst oder einschränkst sieht das Ergebnis ziemlich dämlich aus. Und beim Vorlesen-lassen der Seite hört es sich auch so an ("Listeneintrag: minus Karotten. Listeneintrag: minus Kondome, ...").
Antwort 13 von fitzefitzefatze
Zitat:
...sieht das Ergebnis ziemlich dämlich aus.
...sieht das Ergebnis ziemlich dämlich aus.
Geschmackssache!
speak-punctuation:noneund schon werden keine satzzeichen ausgesprochen (die sowieso keiner ausspricht!)
Antwort 14 von rfb
fällt das - unter
Und auch hier gilt: ohne Autoren-CSS klappts nicht.
Wie auch immer: diese Vermischung von Inhalt und Layout ist eigentlich nicht im Sinne der strengen Trennung, wie sie vom W3C gefordert wird und mE auch höchst sinnvoll ist.
speak-punctuation:noneUnd auch hier gilt: ohne Autoren-CSS klappts nicht.
Wie auch immer: diese Vermischung von Inhalt und Layout ist eigentlich nicht im Sinne der strengen Trennung, wie sie vom W3C gefordert wird und mE auch höchst sinnvoll ist.
Antwort 15 von Mich
Hallo,
kann man das so zusammenfassen:
Der "grundsätzliche" Einzug (also Abstand vom linken Rand bis zum Punkt/Quadrat) läßt sich nicht zuverlässig einstellen ?
Mich
kann man das so zusammenfassen:
Der "grundsätzliche" Einzug (also Abstand vom linken Rand bis zum Punkt/Quadrat) läßt sich nicht zuverlässig einstellen ?
Mich
Antwort 16 von rfb
ja, darauf läufts wohl hinaus