WebWork Magazin - Webseiten erstellen lassen, Online Medien, html

Webhoster, Webhosting Provider und Domain registrieren

Home | Registrieren | Einloggen | Suchen | Aktuelles | GSL-Webservice | Suleitec Webhosting
Reparatur-Forum | Elektro forum | Ersatzteilshop Haushalt und Elektronik


Homepage und Webhosting-Forum

HTML, XHTML, CSS , style, XML, Javascript und mehr, Fragen, Tipps und Anregungen zu diesen Basic Techniken - hier rein !


Forum » HTML, CSS - Hilfe für das Erstellen einer Homepage » CSS - horizontale Listen zentrieren » Antworten
Benutzername:
Passwort: Passwort vergessen?
Inhalt der Nachricht: Fett | Kursiv | Unterstrichen | Link | Bild | Smiley | Zitat | Zentriert | Quellcode| Kleiner Text
Optionen: Emailbenachrichtigung bei Antworten
 

Die letzten 5 Postings in diesem Thema » Alle anzeigen
von Herr_Zatacke
Geht doch nicht .... :(
Der IE macht da Mist mit dem zusätzlichen <li>.

Jetzt mach ich's über ne zusätzliche Klasse die die Höhe definiert

1:
"<ul class=\"bilder z" . ceil((mysql_num_rows($result)/$bilder_pro_zeile)) . "\">\n"

und
1: 
2: 
3: 
4:
ul.z1 { height:130px; }
ul.z2 { height:260px; }
ul.z3 { height:390px; }
ul.z4 { height:520px; }
von Herr_Zatacke
nisita schrieb am 20.05.2005 20:26
also, mach einfach ein <li class="clear"></li> nach dem letzten richtigen listen eintrag, und gib der class clear die eigenschaft clear:both;

So hab ich's jetzt mal gemacht. Mal schauen ob ich noh ne andere Lösung finde...
von nisita
das problem sind die floats, die nicht so schließen, wie man sich das eigentlich wünscht.. deswegen muss ein "clearendes" element vor das </ul>... es gibt zwar schon lösungswege das per css zu lösen, die sind allerdings unter aller sinnhaftigkeit...

also, mach einfach ein <li class="clear"></li> nach dem letzten richtigen listen eintrag, und gib der class clear die eigenschaft clear:both;

ich weiß, das ist alles nicht so das, was man wirklich haben will, aber das geht nicht anders... blödes float...

dann nimm die höhe für das ul element komplett raus, und das ul element wird sich an die <li>s anpassen..

hier noch ein link um das nur per css zu lösen:
http://www.orderedlist.com/articles/clearing_floats_fne
http://www.positioniseverything.net/easyclearing.html

mich würde gerne efchens meinung dazu interesieren, wie man die gesamte sache besser lösen könnte.. da efchen eher der markup-typ ist, und für ihm das auch wichtiger ist, als wie es letzendlich aussieht (denke ich mal, und ist ja auch nicht schlimm.. ;) )

mfg
nisita
von Herr_Zatacke
Das funktioniert aber leider nur wenn ich der Liste eine feste Grösse gebe. - Hab ich jetzt auch gemacht und die variablen (Admin-)Elemente in eine eigene Liste gesteckt.

Allerdings hab ich jetzt das gleiche Problem mit variabler Höhe

hier mal das Beispiel:
http://test.furx.de/muster.php

Es geht um die Liste unter der Überschrift '<h2 class="middle">'
Hier können statt den momentanen 4 <li>'s bis zu 15 stehen.
Die <li>'s floaten links und springen perfekt in die nächste Zeile.
Allerdings muss bei einer nicht durch 5 teilbaren Anzahl die Linie rechts gezogen werden, welche die border-right: der <ul> ist. Leider passt sich das <ul> in der höhe nicht an. height:auto; macht das ganze 0 Pixel hoch.

Meine Lösungsansätze:
1) Ein umschliessendes <div> um jede einzelne Zeile (=definierte Höhe) welches die Linie macht. (bzw eine liste die jeweils nur aus maximal 5 <li>-Elementen besteht.
2) Auffüllen der Zeile mit "leeren" <li></li> bis zum ende jeder Zeile.
3) Die Höhenangabe für <ul> per PHP einfügen (class="$zeilenzahl")

Leider gefallen mir die Ansätze alle nicht so wirklich, drum hoffe ich jemand von euch hat da ne bessere Idee.
von nisita
das mit dem darumliegenden blockelemt und der festen größe war quatsch.. es muss nur das ul element eine feste breite haben, und dann geht das schon...
für body kann man auch eine feste breite angeben, aber brauchst du ja nicht..

viel spass noch mit der div-suppe

Nach oben