CSS - Tipps & Tricks: Unterschied zwischen den Versionen
Aus Wikizone
| Zeile 1: | Zeile 1: | ||
| + | == Listenpunkte == | ||
| + | Besser als mit | ||
| + | ul { | ||
| + | list-style-image: url(bild.png); | ||
| + | } | ||
| + | lassen sich Listenpunkte mit | ||
| + | ul li.mithintergrund { | ||
| + | background: url(bild.png) 0 50%; | ||
| + | padding-left: [Breite der Grafik + Abstand]px | ||
| + | } | ||
| + | positionieren. | ||
== Flexibler 2-Spalter mit gleichlangen Spalten == | == Flexibler 2-Spalter mit gleichlangen Spalten == | ||
Version vom 23. Juni 2006, 13:08 Uhr
Listenpunkte
Besser als mit
ul {
list-style-image: url(bild.png);
}
lassen sich Listenpunkte mit
ul li.mithintergrund {
background: url(bild.png) 0 50%;
padding-left: [Breite der Grafik + Abstand]px
}
positionieren.
Flexibler 2-Spalter mit gleichlangen Spalten
Dazu verwendet man ein relativ positioniertes Hintergrundbild
Methode 1:
display:inline;
Methode 2:
float:left;
für das li Element + "Float nearly everything" Methode - d.h. das übergeordnete ul Element muß ebenfalls gefloatet werden, sonst werden die Listenpunkte nicht umschlossen.