Ungewollter Zeilenumbruch - Bug unauffindbar

[lorddoener]

Hallo!
Ich habe auf meiner Webseite ein neues Design aufgespielt. Warum dieser "Bug" plötzlich kam weis ich auch nicht. Denn jetzt zeigt er mir eine leere Zeile unter der Buttonleiste an. Diese Zeile trennt die Buttons und den darunterliegenden Trennstrich voneinander.

Hier der Ausschnitt des HTML Codes:
HTML-Code:

<!-- Banner -->
<a href="index.php">
<img src="images/header.jpg" border="0">
</a><br>
<!-- 1. Trennstrich -->
<img src="images/trenn1.jpg" border="0"><br>
<!-- BUTTONS -->
<a href="index.php"><img src="images/top_start.gif" border="0"></a>
<a href="contest.php"><img src="images/top_contest.gif" border="0"></a>
<a href="statistik.php"><img src="images/top_stats.gif" border="0"></a>
<a href="impressum.php"><img src="images/top_imp.gif" border="0"></a>
<a href="faq.php"><img src="images/top_faq.gif" border="0"></a>
<?php
if(isset($_SESSION["user"]))
{
echo "<a href="profil.php"><img src="images/top_profil.gif" border="0"></a>";
}else{
echo "<a href="new.php"><img src="images/top_register.gif" border="0"></a>";
}
?>
<!-- / BUTTONS -->
<br>
<!-- 2. Trennstrich -->
<img src="images/trenn2.jpg" border="0">

Ich weis nicht, ob es damit etwas zu tun hat. Sollte noch mehr Code gebraucht werden ist dieser Komplett auf der Webseite (http://4gamers-unlimited.com) einsehbar.

Ich weis leider auch nicht, ob es etwas mit dem CSS Code auf sich hat.
Der wäre dann unter http://www.4gamers-unlimited.com/css/classes.css einsehbar.

Vielen Dank im voraus - lorddoener

[Samoht]

Gudn!

Validiere bitte erstmal Deinen Code. Keiner wird sich sonst um Dich bemühen. Selbst mit einem doctype-override auf HTML 4.01 Transitional hast Du noch 25 Fehler.

Gruß aus Fürth in Mittelfranken,
Samoht

[lorddoener]

gruß

ich bin schon am verzweifeln. In einem anderen Forum habe ich diese Frage schon mal gestellt. Ein ganzes Dokument validieren, um einen Zeilenumbruch zu verhindern oder zu beheben?
Der Bug war am Anfang noch nicht da und da hatte die Seite noch mehr Fehler.

Entweder ist das mit dem validieren zu hoch für mich und ich verstehe nicht, wie man damit Zeilenumbrüche verhindern kann oder ihr habt auch keine konkrete Antwort?!

MFG lorddoener

[Harlequin]

Yerf!

Entweder ist das mit dem validieren zu hoch für mich und ich verstehe nicht, wie man damit Zeilenumbrüche verhindern kann oder ihr habt auch keine konkrete Antwort?!

Das Validieren stellt deinen Code erst einmal auf ein vernünftiges Fundament. Invalider Code ist unberechenbar, da kann schon eine kleine Änderung die komischsten Sachen auslösen. Von daher sollte man *immer* schauen, das der Code valide ist.

Einen Tip dazu: fange beim Korrigieren grundsätzlich mit dem ersten Fehler an (auch wenn es einfacher erscheint erst mal andere Fehler anzugehen), die weiteren könnten Folgefehler sein.

Und weils mir grad ins Auge gesprungen ist:

<!-- / BUTTONS -->
<br>
<!-- 2. Trennstrich -->

Du wunderst dich über einen Zeilenumbruch zwischen den Buttons und dem Trennstrich?

Gruß,

Harlequin

[lorddoener]

Und weils mir grad ins Auge gesprungen ist:

<!-- / BUTTONS -->
<br>
<!-- 2. Trennstrich -->

Du wunderst dich über einen Zeilenumbruch zwischen den Buttons und dem Trennstrich?

ja das tue ich!
ich habs auch schon ohne das <br> versucht -> zeilenumbruch blieb aber!

[Griever]

Und weils mir grad ins Auge gesprungen ist:

<!-- / BUTTONS -->
<br>
<!-- 2. Trennstrich -->

Du wunderst dich über einen Zeilenumbruch zwischen den Buttons und dem Trennstrich?

ja das tue ich!
ich habs auch schon ohne das <br> versucht -> zeilenumbruch blieb aber!

Sind die a-tags als display:block definiert? Wenn ja, lasse mal nach dem letzten link den zeilenumbruch (kein br, sondern der quelltext-zeilenumbruch) weg.

also z. b. so:

<a href="blabla">...</a><?

php-code ...

?><!-- Kommentar --><hr> usw ...

also sodass halt keine Zeilenumbrüche direkt ausgegeben werden.

Es ist möglich, dass dadurch ein erzwungenes Leerzeichen angefügt wird, was aufgrund der display-block-eigenschaft der Links zu einem Zeilenumbruch führt. Habe diesen Effekt sehr häufig bei IE sehen dürfen. Firefox vermag unter gewissen Umständen auch gerne mal zu einem ungewollten Zeilenumbruch

MFG
Griever

[lorddoener]

Habe ich mal so probiert, aber er zeigt nur im Quellcode einen Unterschied.
Ich habe nichts in der Art von display:block geschrieben. Das würde man dann ja auch im Stylesheet sehen.

Aber einen Versuch wars wert!

MFG lorddoener

[lorddoener]

Vielen Dank für die Mühe und Ärgernisse mit mit! :P
Ich habe es nun folgender Maßen gelöst:

Ein <div> um die Buttons und diesem eine Klasse gegeben.
In der Klasse steht, dass es ein Hintergrundbild hat (Balken oben und unten, in der Mitte transparent) und alles vertikal und horizontal zentriert ist.

Trotzdem Danke!

PS: Ein wenig geschummelt habe ich schon mit der transparenz, aber es sieht jetzt genau so aus, wie ich es wollte!^^

[Samoht]

Gudn!

PS: Ein wenig geschummelt habe ich schon mit der transparenz, aber es sieht jetzt genau so aus, wie ich es wollte!^^

Valide ist Deine Seite aber immer noch nicht...

Gruß aus Fürth in Mittelfranken,
Samoht

[lorddoener]

Gudn!

PS: Ein wenig geschummelt habe ich schon mit der transparenz, aber es sieht jetzt genau so aus, wie ich es wollte!^^

Valide ist Deine Seite aber immer noch nicht...

Gruß aus Fürth in Mittelfranken,
Samoht

Auch wenn ihr "alles 100%ig richtig" leute das könnt ist das schön, aber ich verstehe das meiste nicht, was mir der validator ausgibt.
1. wegen dem kompliziertem Englisch und
2. wegen den ganzen Begriffen, die ich nicht kenne.

Aber wenn mir mal jemand dabei helfen würde, also per MSN oder hier im Forum, dann würde ich es wahrscheinlich machen.

[Samoht]

Gudn

Auch wenn ihr "alles 100%ig richtig" leute das könnt ist das schön, aber ich verstehe das meiste nicht, was mir der validator ausgibt.

1. wegen dem kompliziertem Englisch und
2. wegen den ganzen Begriffen, die ich nicht kenne.

Ach komm... so schwierig ist das auch wieder nicht. Außerdem trägt valides (X)HTML dazu bei, dass die Browser das machen, was sie soll(t)en.

Aber wenn mir mal jemand dabei helfen würde, also per MSN oder hier im Forum, dann würde ich es wahrscheinlich machen.

Du verwendest XHTML 1.0 strict. Das verursacht sehr viele Fehler, vermutlich deswegen, weil Du nicht weißt, was die Unterschiede zwischen HTML und XHTML sind und vor allem weil Du nicht weißt, was "strict" heißt

Wie weiter oben schon gesagt: Ändere Dein Doctype für den Anfang auf HTML 4.01, befrage den Validator, und wenn Du Probleme mit dem hat was er ausspuckt uns!

Es ist einfacher als Du denkst.

Gruß aus Fürth in Mittelfranken,
Samoht

[lorddoener]

Gudn

Auch wenn ihr "alles 100%ig richtig" leute das könnt ist das schön, aber ich verstehe das meiste nicht, was mir der validator ausgibt.

1. wegen dem kompliziertem Englisch und
2. wegen den ganzen Begriffen, die ich nicht kenne.

Ach komm... so schwierig ist das auch wieder nicht. Außerdem trägt valides (X)HTML dazu bei, dass die Browser das machen, was sie soll(t)en.

Aber wenn mir mal jemand dabei helfen würde, also per MSN oder hier im Forum, dann würde ich es wahrscheinlich machen.

Du verwendest XHTML 1.0 strict. Das verursacht sehr viele Fehler, vermutlich deswegen, weil Du nicht weißt, was die Unterschiede zwischen HTML und XHTML sind und vor allem weil Du nicht weißt, was "strict" heißt

Wie weiter oben schon gesagt: Ändere Dein Doctype für den Anfang auf HTML 4.01, befrage den Validator, und wenn Du Probleme mit dem hat was er ausspuckt uns!

Es ist einfacher als Du denkst.

Gruß aus Fürth in Mittelfranken,
Samoht

Danke!
nö, ich weis nicht was strict ist!
Mein PHP Editor hat mir das an den Anfang meines Dokuments gestellt und deswegen steht das dort.

Ok, das habe ich mal geändert.
Einen Error konnte ich schon mal beseitigen, aber ein paar Sachen sind noch sehr schwierig für mich.

Das versteh ich zum Beispiel nicht:

#  Error  Line 11, Column 19: document type does not allow element "DIV" here.

<div class="gesamt">

✉

The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements -- such as a "style" element in the "body" section instead of inside "head" -- or two elements that overlap (which is not allowed).

One common cause for this error is the use of XHTML syntax in HTML documents. Due to HTML's rules of implicitly closed elements, this error can create cascading effects. For instance, using XHTML's "self-closing" tags for "meta" and "link" in the "head" section of a HTML document may cause the parser to infer the end of the "head" section and the beginning of the "body" section (where "link" and "meta" are not allowed; hence the reported error).
<<

[Harlequin]

Yerf!

Das versteh ich zum Beispiel nicht:

#  Error  Line 11, Column 19: document type does not allow element "DIV" here.

<div class="gesamt">

Es gibt in HTML bestimmte Regeln, welche Elemente wie ineinander verschachtelt werden dürfen. So dürfen Inline-Elemente (wie z.B. SPAN) und manche Block-Elemente (wie z.B. P) nur Inline-Elemente enthalten (die genauen Regeln gibts z.B. in http://de.selfhtml.org/html/referenz/elemente.htm@title=SelfHTML).

Das DIV (ein Blockelement) steht vermutlich in einem Inline-Element oder Absatz (P). Hier muss nun überlegt werden, ob das äußere Element oder der DIV angepasst werden sollte, eine generelle Regel dafür gibt es nicht (außer, dass HTML die Struktur möglichst passend beschreiben soll).

Gruß,

Harlequin

[lorddoener]

Yerf!

Das versteh ich zum Beispiel nicht:

#  Error  Line 11, Column 19: document type does not allow element "DIV" here.

<div class="gesamt">

Es gibt in HTML bestimmte Regeln, welche Elemente wie ineinander verschachtelt werden dürfen. So dürfen Inline-Elemente (wie z.B. SPAN) und manche Block-Elemente (wie z.B. P) nur Inline-Elemente enthalten (die genauen Regeln gibts z.B. in http://de.selfhtml.org/html/referenz/elemente.htm@title=SelfHTML).

Das DIV (ein Blockelement) steht vermutlich in einem Inline-Element oder Absatz (P). Hier muss nun überlegt werden, ob das äußere Element oder der DIV angepasst werden sollte, eine generelle Regel dafür gibt es nicht (außer, dass HTML die Struktur möglichst passend beschreiben soll).

Gruß,

Harlequin

Dieses div Element ist aber das äußerste Element auf der ganzen Site.
Oder bedeutet das, dass etwas darin verschachtelt ist, was eigentlich nicht drinnen sein darf?

Gibts irgend einen Editor, der diese verschachtelungshirachie übersichtlich darstellt oder gleich Vorschläge liefert, bzw. das ganze ausbessert?!
Wahrscheinlich stell ich mir das zu einfach vor.

An solche sachen mit validieren und so dachte ich gar nicht, wie ich meine Site so schön verschachtelt habe!^^

[Harlequin]

Yerf!

Dieses div Element ist aber das äußerste Element auf der ganzen Site.
Oder bedeutet das, dass etwas darin verschachtelt ist, was eigentlich nicht drinnen sein darf?

Ich hab mir grad mal deine Seite direkt angeschaut... Der Fehler ist, das der DIV das äußerste Element ist... da fehlt noch etwas drumherum (siehe http://de.selfhtml.org/html/allgemein/grundgeruest.htm@title=HTML-Grundgerüst). Da steht auch, wie der Doctype exakt aussehen muss, du hast nur den ersten Teil ausgetauscht, aber der zweite Teil muss dazu passen (die Aussage in dem verlinkten Artikel, dass man die DTD auch weglassen kann würde ich ignorieren, das gibt Probleme im IE)

Gibts irgend einen Editor, der diese verschachtelungshirachie übersichtlich darstellt oder gleich Vorschläge liefert, bzw. das ganze ausbessert?!

Ich benutz immer das Validator-Plugin für den Firefox. Das sagt zwar auch nicht viel anderes als der Validator, aber es ist einfacher zu benutzen, da man über die Quelltextansicht sofort auch das Validator-Ergebnis bekommt. (Über Tidy wär auch eine Autokorrektur möglich, aber die ist mit Vorsicht zu geniesen)

Wahrscheinlich stell ich mir das zu einfach vor.

Teilweise ist sowas schon möglich, ich wüsst aber im Moment keinen "günstigen" Editor der das macht (ich kenns nur vom MS VisualStudio 2005, obwohl, die Express-Versionen gibts ja kostenlos... wär aber eher ne Atomrakete auf nen Spatzen oder so...)

Gruß,

Harlequin

[lorddoener]

Yerf!

Dieses div Element ist aber das äußerste Element auf der ganzen Site.
Oder bedeutet das, dass etwas darin verschachtelt ist, was eigentlich nicht drinnen sein darf?

Ich hab mir grad mal deine Seite direkt angeschaut... Der Fehler ist, das der DIV das äußerste Element ist... da fehlt noch etwas drumherum (siehe http://de.selfhtml.org/html/allgemein/grundgeruest.htm@title=HTML-Grundgerüst). Da steht auch, wie der Doctype exakt aussehen muss, du hast nur den ersten Teil ausgetauscht, aber der zweite Teil muss dazu passen (die Aussage in dem verlinkten Artikel, dass man die DTD auch weglassen kann würde ich ignorieren, das gibt Probleme im IE)

Gibts irgend einen Editor, der diese verschachtelungshirachie übersichtlich darstellt oder gleich Vorschläge liefert, bzw. das ganze ausbessert?!

Ich benutz immer das Validator-Plugin für den Firefox. Das sagt zwar auch nicht viel anderes als der Validator, aber es ist einfacher zu benutzen, da man über die Quelltextansicht sofort auch das Validator-Ergebnis bekommt. (Über Tidy wär auch eine Autokorrektur möglich, aber die ist mit Vorsicht zu geniesen)

Wahrscheinlich stell ich mir das zu einfach vor.

Teilweise ist sowas schon möglich, ich wüsst aber im Moment keinen "günstigen" Editor der das macht (ich kenns nur vom MS VisualStudio 2005, obwohl, die Express-Versionen gibts ja kostenlos... wär aber eher ne Atomrakete auf nen Spatzen oder so...)

Gruß,

Harlequin

Das mit dem Grundgerüst hatte ich diesmal weggelassen, da ich an solche sachen wie strict, tranditional, ... nicht dachte. Jetzt habe ich das Grundgerüst erstellt, er gibt mir immer noch die gleiche Anzahl von Fehlern aus. (einer kam dazu, weil ich ein favicon eingebunden habe!^^)

Validator Plugin kann ich nur tagsüber benutzen (jetzt grade linux und da gibts das plugin nicht!)

Das Doctype werde ich gleich mal richten.

MFG lorddoener

[Harlequin]

Yerf!

Das mit dem Grundgerüst hatte ich diesmal weggelassen, da ich an solche sachen wie strict, tranditional, ... nicht dachte. Jetzt habe ich das Grundgerüst erstellt, er gibt mir immer noch die gleiche Anzahl von Fehlern aus. (einer kam dazu, weil ich ein favicon eingebunden habe!^^)

Beim favicon liegts am abschließenden "/", das ist XHTML-Schreibweise (und außerdem sollte es innerhalb vom <title> stehen). Das sollte so sein:

<link rel="shortcut icon" type="image/x-icon" href="images/favicon.ico">

Ein Teil der Fehler kommt jetzt davon, dass du momentan den Doctype für HTML4.01 Strict hast, da sind einige Elemente und Attribute nicht mehr erlaubt. Prinzipiell ist Strict zu empfehlen, aber das macht jetzt etwas mehr Arbeit beim Korrigieren.

Ansonsten hast du neben ein paar fehlenden Alt-Attributen bei Bildern vor allem ein Problem bei der Verschachtelung der Elemente. Am besten versuchst du mal den Code etwas sauberer zu strukturieren und per Einrücken deutlich zu machen, wo ein Element beginnt und wieder endet (ein Editor wie PS-Pad kann das auch automatisch). Dann sollte man relativ leicht sehen, wo die Verschachtelung nicht stimmt.

Validator Plugin kann ich nur tagsüber benutzen (jetzt grade linux und da gibts das plugin nicht!)

Oh, stimmt, da war was (ich arbeite fast nur mit Windows)...

Gruß,

Harlequin

[at]

Hallo.

Beim favicon liegts am abschließenden "/", das ist XHTML-Schreibweise (und außerdem sollte es innerhalb vom <title> stehen).

Letzteres ist natürlich Unfug, da <title> gar keine weiteren Elemente enhalten darf.
MfG, at

[Harlequin]

Yerf!

Beim favicon liegts am abschließenden "/", das ist XHTML-Schreibweise (und außerdem sollte es innerhalb vom <title> stehen).

Letzteres ist natürlich Unfug, da <title> gar keine weiteren Elemente enhalten darf.

Ups, das sollte natürlich <head> sein... danke für die Korrektur.

Gruß,

Harlequin

[lorddoener]

Ok, ich hab auch noch ein wenig nach Fehlern gegoogelt, aber nix gefunden. Abgesehen von dem favicon und den alt tags habe ich ne Menge Fehler beseitigen können. Jetzt hab ich nur noch 3 Fehler, die mich von einer komplett validierten Seite fernhalten. Bei diesen 3 Fehlern hab ich aber KP, worum es sich handeln könnte. Könnt ihr mir bitte die Lösung sagen? Ihr wisst sie bestimmt schon!

MFG lorddoener

PS: Ich habe beim Validator den Source Code anzeigen lassen. Zwar nicht mit Syntax-Highlighting, aber mit Zeilennummerierung, sodass ich immer sah, wo die Fehler waren, nur bei diesen 3 Fehlern hab ich null Durchblick!

[at]

Hallo.

Jetzt hab ich nur noch 3 Fehler, die mich von einer komplett validierten Seite fernhalten. Bei diesen 3 Fehlern hab ich aber KP, worum es sich handeln könnte.

Du schließt das <head>-Element, bevor dessen Inhalt vollständig ist. Vollständig ist <head> nämlich erst, wenn du einen <title> definierst.
Die anderen Fehler sollten mit dem Beseitigen der aufgrund ihrer für diesen Dokumententyp mangelnden Zulässigkeit bemängelten Attribute verschwinden.
MfG, at

[lorddoener]

Ok! Danke vielmals!
Meine Seite ist jetzt Valid!

Aber eine Warnung gibt es noch. Was muss ich da machen?

[Harlequin]

Yerf!

Aber eine Warnung gibt es noch. Was muss ich da machen?

Die BOM ist eine Markierung für die Unicode-Codierung. Allerdings ist diese a) bei UTF-8 überflüssig und b) macht sie gelegentlich auch Probleme.

Um sie loszuwerden musst du deinen Editor, mit dem du die Datei bearbeitest entsprechend einstellen (irgendwo unter Zeichencodierung oder so auf UTF-8 ohne BOM stellen) oder aber einen anderen Editor nehmen (wenn es nicht einstellen geht).

Gruß,

Harlequin

[lorddoener]

Vielen vielen vielen Dank!
Mit eurer Hilfe wurde meine Site endlich valid!
Ich benutze Eclipse, der für mich recht neu ist. Davor verwendete ich ts_webeditor und konnte mich daran erinnern, die dateien mit einer utf-8 codierung gesoeichert zu haben. unten in der arbeitsleiste gibt es ein menü, bei dem man "ohne BOM speichern" deaktivieren konnte und in allen Varianten speichern konnte.

Sollte ich auch noch die anderen Sites validieren?

MFG lorddoener

PS: Ich hab auch gleich mal den CSS Validator (genialer Weise auf deutsch) über mein Stylesheet laufen lassen, fand einen Fehler, den ich sofort behob und nun ist auch mein CSS valid!

[at]

Hallo.

Sollte ich auch noch die anderen Sites validieren?

Oftmals wird hier der Eindruck erweckt, Validität sei um ihrer selbst willen sinnvoll und erstrebenswert. Das mag aber jeder für sich selbst entscheiden.
Validität stellt aber sicher die Grundvoraussetzung für sinnvolle Korrekturen dar, die auf die Darstellung, das Verhalten oder die maschinelle Weiterverarbeitung, etwa durch Suchmaschinen, des Dokumentes oder von Teilen dessen zum Ziel haben.
Insofern kann nur insgesamt zur Validierung geraten werden, während sie für das Ersuchen von Hilfe in diesem Forum sogar als verpflichtend angesehen werden sollte.

PS: Ich hab auch gleich mal den CSS Validator (genialer Weise auf deutsch) über mein Stylesheet laufen lassen, fand einen Fehler, den ich sofort behob und nun ist auch mein CSS valid!

Das ist ein guter Anfang.
MfG, at

[lorddoener]

Ok danke für die vielen Tipps, Hilfestellungen, ...!

Meine Seite (auch die unterseiten) -> valid
CSS -> valid

Was sollte ich eigentlich noch beachten?

MFG lorddoener

[Harlequin]

Yerf!

Was sollte ich eigentlich noch beachten?

Was noch wäre ist die Verwendung von semantischem HTML und die Trennung von Inhalt und Darstellung. Durch die Verwendung von HTML Strict bist du da schon recht nah dran, ein paar Punkte gints aber trotzdem. Z.B. hast du noch eine Tabelle drinnen, die eigentlich keine tabellarischen Daten enthält sondern dem Layout dient. Außerdem könnten noch ein paar Aufzählungen (z.B. die Links vom menü) als Liste verpackt werden. Das HTML sollte den Text nur strukturieren und anhand seines Inhaltes auszeichen. Die Darstellung am Bildschirm (oder Drucker etc.) sollte dann CSS regeln.

Das ist aber ein Punkt den man nach und anch angehen kann, da muss man auch ein bischen Gespühr entwickeln, wie man den konkreten Fall jetzt am besten löst. Wenn du hier im Forum etwas die HTML und CSS Threads mitliest wirst du das merken.

Gruß,

Harlequin

[lorddoener]

»»Z.B. hast du noch eine Tabelle drinnen, die eigentlich keine tabellarischen Daten enthält sondern dem Layout dient.

Stattdessen mit divs? kann ich die nebeneinander setzen, ohne dass das zweite sich unter das erste setzt?

»»Außerdem könnten noch ein paar Aufzählungen (z.B. die Links vom menü) als Liste verpackt werden.

Wenn ich dem <li> Elemente verpasse bekommen die Punkte und machen automatisch Zeilenumbrüche.

»»Das HTML sollte den Text nur strukturieren und anhand seines Inhaltes auszeichen.

Genau das musste ich ja machen, um meine site valide zu machen, oder?

»»Die Darstellung am Bildschirm (oder Drucker etc.) sollte dann CSS regeln.

Das habe ich ja auch versucht, bei diesem Projekt einzubauen, aber da ich noch den alten Code und das neue Design hatte war das am Anfang sehr schwierig.

Das ist aber ein Punkt den man nach und anch angehen kann, da muss man auch ein bischen Gespühr entwickeln, wie man den konkreten Fall jetzt am besten löst.

Ich kenne mich schon gut in PHP aus, in HTML kenne ich die meisten Elemente, nur das mit dem Strict war mir eben früher, also zu dem Zeitpunkt als ich das Pixelmonster programmierte, noch nicht bekannt.

»»Wenn du hier im Forum etwas die HTML und CSS Threads mitliest wirst du das merken.

Ich lese schon sehr viel mit, aber sie Forumstruktur ist nicht die, die ich von den meisten Foren gewöhnt bin. Ich finde es toll, dass dieses Forum extra für diese Seite geproggt wurde, aber wirklich übersichtlich ist anders.

[Harlequin]

Yerf!

Stattdessen mit divs? kann ich die nebeneinander setzen, ohne dass das zweite sich unter das erste setzt?

Wenn sich kein besseres Element finden lässt dann mit einem <div> (Die ist die grundsätzliche Überlegung bei semantischem HTML, es gibt nicht Umsonst soviele verschiedene Elemente. Ein <div> ist zum Gruppieren anderer Elemente ohne eine weitere Aussage über diese zu treffen).

Das Nebeneinander lässt sich dann per CSS z.B. mit float regeln. Du kannst dir ja mal hier bei SelfHTML die <http://de.selfhtml.org/css/layouts/index.htm@title=fertigen Layouts> oder den Artikel zum Spaltenlayout anschauen.

»»Außerdem könnten noch ein paar Aufzählungen (z.B. die Links vom menü) als Liste verpackt werden.

Wenn ich dem <li> Elemente verpasse bekommen die Punkte und machen automatisch Zeilenumbrüche.

Man wählt HTML-Elemente nicht wegen ihrem Aussehen sondern wegen ihrem Zweck. Das Aussehen lässt sich dann per CSS wie gewünscht einstellen (http://de.selfhtml.org/css/eigenschaften/listen.htm#list_style_type@title=Listenpunkte, und Nebneinander darstellen z.B. mit diplay:inline)

Das habe ich ja auch versucht, bei diesem Projekt einzubauen, aber da ich noch den alten Code und das neue Design hatte war das am Anfang sehr schwierig.

Wie gesagt, das ist ein Prozess der schrittweise vorangeht. Alles auf einmal umstellen zu wollen führt meist zu Frustration.

Ich lese schon sehr viel mit, aber sie Forumstruktur ist nicht die, die ich von den meisten Foren gewöhnt bin. Ich finde es toll, dass dieses Forum extra für diese Seite geproggt wurde, aber wirklich übersichtlich ist anders.

Wenn du dich hier registrierst kannst du dir noch einiges am Forum einstellen (uninteresante Themengebiete ausblenden, Threadsortierung usw.), aber so unübersichtlich finde ichs gar nicht. Im Gegenteil: meistens hat man ja nicht mal ein Forum sondern nur ein Board, bei dem man nicht sehen kann, wer jetzt eigentlich auf wen geantwortet hat, *das* ist unübersichtlich.

Gruß,

Harlequin

[lorddoener]

Ich habe der Navigation mal das <ul> Tag verpasst und jede Zeile mit einem <li> Tag ausgezeichnet. Aber er bastelt mir immer Zeilenumbrüche hinein!
Der geparste Code ist auf meiner Website verfügbar, der ungeparste hier:

<ul class="navigation">
   <!-- BUTTONS -->
   <li><a href="index.php"><img src="images/top_start.gif" alt="startseite"></a></li>
   <li><a href="contest.php"><img src="images/top_contest.gif" alt="Pixelcontest"></a></li>
   <li><a href="statistik.php"><img src="images/top_stats.gif" alt="Statistik"></a></li>
   <li><a href="impressum.php"><img src="images/top_imp.gif" alt="Impressum"></a></li>
   <li><a href="faq.php"><img src="images/top_faq.gif" alt="Impressum"></a></li>
   <?php
   if(isset($_SESSION["user"]))
   {
   echo "<li><a href="profil.php"><img src="images/top_profil.gif" alt="Profil"></a></li>";
   }else{
   echo "<li><a href="new.php"><img src="images/top_register.gif" alt="Registrieren"></a></li>";
   }
   ?>
   <!-- / BUTTONS -->
  </ul>

Im Stylesheet steht folgendes:

.navigation{
margin: 0;
padding: 0;
border: 0;
list-style-type: none;
display: inline;
background-color: #321F00;
background-image: url(/images/button_bg.gif);
background-repeat:repeat-x;
}

Ich kann den Fehler einfach nicht finden!
So wie jetzt zerschießt es mir das Layout.

MFG lorddoener

[at]

Hallo.

Ich habe der Navigation mal das <ul> Tag verpasst und jede Zeile mit einem <li> Tag ausgezeichnet.

Ein guter Ansatz.

Der geparste Code ist auf meiner Website verfügbar, der ungeparste hier:

Und wo finde ich noch gleich deine Website? Für Suchspiele ist mir der Thread zu lang.

<ul class="navigation">

[...]

.navigation{

[...]

display: inline;

[...]

Ich kann den Fehler einfach nicht finden!

Du weist der Liste eine Eigenschaft zu, obwohl du den Listenpunkten die Eigenschaft zuweisen willst.
MfG, at

[lorddoener]

Du weist der Liste eine Eigenschaft zu, obwohl du den Listenpunkten die Eigenschaft zuweisen willst.

Das war der Satz, der das Problem gelöst hat!
Habe eine zweite Klasse angelegt (für <ul> )mit Hintergrundfarbe, Hintergrundbild, ... und eine für die <li> Elemente.

Der Code ist unter http://www.4gamers-unlimited.com abrufbar.
Der jetzige CSS Code unter http://www.4gamers-unlimited.com/css/classes.css.

MFG lorddoener

[at]

Hallo.

Habe eine zweite Klasse angelegt (für <ul> )mit Hintergrundfarbe, Hintergrundbild, ... und eine für die <li> Elemente.

Die wäre aber gar nicht notwendig, den der Selektor .buttonleiste li funktioniert ja auch und hält den HTML-Code sauberer.
MfG, at

[lorddoener]

Hallo.

Habe eine zweite Klasse angelegt (für <ul> )mit Hintergrundfarbe, Hintergrundbild, ... und eine für die <li> Elemente.

Die wäre aber gar nicht notwendig, den der Selektor .buttonleiste li funktioniert ja auch und hält den HTML-Code sauberer.

Das hatte ich auch versucht, aber dann war das ganze Design verzerrt. Zumindest so lange, bis ich das mit 2 Klassen regelte.

[at]

Hallo.

Das hatte ich auch versucht, aber dann war das ganze Design verzerrt.

Das kann ich zwar nicht nachvollziehen, aber deine Notlösung ist ja auch nicht falsch, sondern nur ein wenig unelegant.
Und ich bin mir sicher, dass du jetzt, da du einmal auf den Geschmack gekommen bist und die Mechanismen grundsätzlich verstanden hast, weiter daran arbeiten wirst.
Deshalb Gratulation und weiterhin viel Erfolg.
MfG, at

[Harlequin]

Yerf!

Sollte ich auch noch die anderen Sites validieren?

Ist auf jeden Fall zu empfehlen, nicht nur, damit man sagen kann "ist valide", sondern auch, um böse Überraschungen bei späteren Änderungen an den Seiten vorzubeugen. Denn auch wenn die Fehler zur Zeit keine Auswirkung haben, so kann sich das später sehr schnell ändern, vor allem wenn man etwas Javascript oder komplexeres CSS hinzufügt.

Gruß,

Harlequin

[Samoht]

Gudn!

Vielen vielen vielen Dank!
Mit eurer Hilfe wurde meine Site endlich valid!

*strike* Missioniert!

SCNR

Gruß aus Fürth in Mittelfranken,
Samoht