PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : Listenformatierung und Abstände


Henrik
2006-06-14, 18:01:33
Hi

habe länger nicht gecodet und stecke deshalb gerade fest. Ich schreibe in XHTML 1.1 und formatiere alles in CSS (wenn auch nicht zu 100% semantisch korrekt ;) ).
Deshalb möchte ich auch die Navigation als Liste schreiben.
Allerdings werden die einzelnen Listenpunkte trotz display:inline in Absätzen angeordnet.
Zudem passen auch die Abstände nicht. Trotz *{margin:0px; padding:0px;} werden die Abstände nicht auf null gesetzt.
Das dritte Problem ist der nicht valide Code (http://validator.w3.org/check?uri=http%3A%2F%2Fwww.einlebenlang-derfilm.de%2Fbeta%2F). Wie kann ich die Fehler beheben?

So soll es aussehen: http://img158.imageshack.us/img158/3488/webdesign38cy.th.jpg (http://img158.imageshack.us/my.php?image=webdesign38cy.jpg)

Und so sieht es aus: www.einlebenlang-derfilm.de/beta

Danke schonmal :)
Henrik

darph
2006-06-14, 19:40:43
<li> ist das Blockelement, das du auf inline umformatieren mußt. Und dann hast du das im Code mit Absätzen geschrieben, die werden vom Browser natürlich als Whitespace erkannt. Drum ist da eine Lücke zwischen den Bildern.


Zeile 59: a ist ein inline Element, und die dürfen nur innerhalb von Blockelementen stehen. <div> drum rum packen.

Die anderen beiden Fehler:
Darf innerhalb der folgenden HTML-Elemente vorkommen:
(außer pre) | [Inline-Elemente] | body
([B]body nur bei HTML Transitional)

Pack also einmal ein div um alles herum, dann sollte es eigentlich passen.

Stylesheets muß man heutzutage aber eigentlich nicht mehr mit HTML-Kommentaren rausfiltern. Und bei den alt-Attributen zu den Bildern mußt du auch noch was ändern.

Beispiel: alt="Wir danken unseren Sponsoren" - welchen? Die sieht ja einer mit Textbrowser (Suchmaschine!) nicht. Im alt-Attribut soll das stehen, was man sieht, wenn man das Bild nicht sehen kann. Zur Beschreibung des Bildes (via poup) verwendest du am Besten das title="" Attribut.

Henrik
2006-06-14, 20:44:34
Die inline-Sache hat jetzt geklappt, danke!

Das mit den Whitespaces habe ich nicht verstanden - wo habe ich denn welche im Quelltext? Habe das Problem jetzt mit margin-Angaben "gelöst" :tongue:

Die DIV Container muss ich noch einbauen, ebenso die Überarbeitung der alt-Attribute.
Also nochmal danke :)

darph
2006-06-14, 21:33:08
Henrik[/POST]']Das mit den Whitespaces habe ich nicht verstanden - wo habe ich denn welche im Quelltext?

Wenn du zwei Bilder direkt nebeneinander stehen haben willst, bündig, ohne Zwischenraum, dann darf dazuwischen kein Whitespace stehen.
gut: <img /><img />
schlecht: <img /> <img />

Zeilenumbrüche im Quelltext werden ja nur als normales Whitespace interpretiert. <img /> <img /> ist also äquivalent zu <img />
<img /> und der Browser wird's zwar in einer Zeile darstellen, aber eben mit Leerzeichen dazwischen.

Du müßtest deine ganze Liste in eine Zeile völlig ohne Leerzeichen schreiben. Sieht zwar im Code blöd aus, ist aber semantisch nicht falscher (eher im Gegenteil, aber das ist eine Designschwäche von XML/SGML, das liegt im System).

Gast
2006-06-14, 21:39:14
probiers mal mit floaten