  |
| Autor |
Nachricht |
knightstyle
User [User]
Anmeldung: 28.07.06
Beiträge: 13
|
 Verfasst am: 06.09.2006, 07:21 Titel: Liste mit Icon am Ende |
 |
|
Guten Morgen,
ich habe eine Liste mit Links auf Dokumente. Damit man sieht um welches Format es sich handelt, wollte ich ein Icon am Ende dieser Liste platzieren.
Da es etwas komisch aussieht, wenn die Icons nicht in einer Reihe platziert sind wollte ich die Icons so anordnen, das es aussieht, als ob sie in einer spalte währen.
Gibt es eine Möglichkeit die Icons so zu formatieren?
Hier ein Beispiel:
Oben: So sieht es aus (nur als Beispiel)
Unten: So soll es aussehen:
|
|
| Nach oben |
|
 |
chris1988
Bekannter [User]
Anmeldung: 12.12.05
Beiträge: 1463
|
| Verfasst am: 06.09.2006, 11:13 Titel: |
|
|
du müsstest wohl den Listenelementen eine vorgeschriebene Breite zuweisen. Die Icons kannst du dann wahlweise als Bild oder als Hintergrundbild einbinden:
Als Bild (<img>) musst du diesen ein float:right zuweisen, als Hintergrund musst du mit background-position: center right; (soweit ich mich erinnern kann war das so) arbeiten.
MfG,
chris
|
|
| Nach oben |
|
|
knightstyle
User [User]
Anmeldung: 28.07.06
Beiträge: 13
|
| Verfasst am: 06.09.2006, 12:39 Titel: |
|
|
Danke...
habe es als Bild gemacht und ihm in seiner Klasse das float: right; zugewiesen.
Zudem noch die Breite der Liste angepasst!
Das Bild darf allerdings kein Element der Liste sein!
danke und gruß
knightstyle
|
|
| Nach oben |
|
|
sejuma
Beliebter [User]
Anmeldung: 08.05.06
Beiträge: 462
|
| Verfasst am: 06.09.2006, 13:13 Titel: |
|
|
Hab's mal mit ner Liste probiert:
CSS:
| Code: | .icon
{position:absolute;
left:200px;
}
#beispiel li
{width: 200px;
list-style-type:none;
} |
HTML
| Code: | <div id="beispiel">
<li>Beispiel <img src="icon.gif" border="0" alt="" class="icon"></li>
<li>Beispiel Beispiel <img src="icon.gif" border="0" alt="" class="icon"></li>
<li>Beispiel Beispiel Beispiel<img src="icon.gif" border="0" alt="" class="icon"></li>
</div> |
|
|
| Nach oben |
|
|
oliwol
Helfer [User]
Anmeldung: 15.12.05
Beiträge: 170
Wohnort: Berlin
|
| Verfasst am: 06.09.2006, 13:31 Titel: AW: |
|
|
Hmmm... also warum so kompliziert. Es würde doch optimal mit einer tabelle funktionieren.
Schließlich handelt es sich ja um eine tabellarische Anordnung.
Gruß Oli
|
|
| Nach oben |
|
|
sejuma
Beliebter [User]
Anmeldung: 08.05.06
Beiträge: 462
|
| Verfasst am: 06.09.2006, 13:45 Titel: |
|
|
jo, es führen viele Wege nach Rom.
CSS liegt halt im "Trend" und so kompliziert ist's ja nun auch wieder nicht.
|
|
| Nach oben |
|
|
knightstyle
User [User]
Anmeldung: 28.07.06
Beiträge: 13
|
| Verfasst am: 07.09.2006, 08:06 Titel: |
|
|
Habe es jetzt nochmal geändert, damit die Icons in der List sind.
Zudem wurden sie auserhalb der liste in der falschen Reihe angezeigt!
Hier würde ich nicht mit Tabellen arbeiten, da es eigentlich der falsche ansatz wäre.
Da es ja eine Liste ist, sollte man auch die liste dafür nehmen 
Jetzt passts und sieht auch noch richtig schick aus...
Danke nochmals für die schnelle und gute hilfe
|
|
| Nach oben |
|
|
|
|
