CSS-Basierendes Menü (IE Fehler?)

Guten Abend,
habe folgendes Problem: Bei meinem Menü, das ich von 1ngo.de/web/tmenu.html#Beispiel2 hab ist ein Fehler… Im Firefox funktioniert alles perfekt, aber im Internet Explorer ist ein etwas größerer Abstand, wenn man mit der Maus auf das aufgeklappte Untermenü fährt klappt es sich wieder wegen dem Abstand ein.

Schaut es euch mal bitte an… wutschkooo.de/testarea/

Danke!

Zum einen enthält die Seite Fehler und offenbar auch mindestens
ein Zeichen, welches nicht mit UTF-8 kodiert ist. Das sollte
jedenfalls korrigiert werden, bevor CSS diskutiert wird.
Zum anderen wird sie wegen fehlendem Doctype im MSIE, in
den Geckos und in Opera im Quirksmodus laufen, da gibt es keine
einheitliche Anzeige der Seite, da der jeweilige browser sich dann
darum bemüht, einige Fehler von älteren Versionen simulieren,
aber auch nicht konsequent.
Ein kompletter Doctype sollte in die Seite, damit man überhaupt
entscheiden kann, ob da was schiefläuft oder nicht.

Ich hab DreamWeaver, kann das Ding Fehler beheben?^^

Hi wutschkooo,

ich hab heut nacht auch mal 2 Stunden damit verbracht dieses Problem zu lösen.
Wie hoffman schon andeutet, hast Du doch diverse Fehler an verschiedenen Stellen (z.B 2 End-divs ohne Start-divs, oder die Codeübernahme als css darf dort aber keine style-tags haben (die bräuchte man in der HtmlSeite) ).

Interessant ist doch, dass die HP von 1ingo auch unter IE funktioniert, die Codes auf der Seite aber unterschiedlich sind, als das, was er vorne angibt. Zudem verwendet es noch striktes XHTML, womit ich noch nie gearbeitet habe.

Apropos: obwohl Du ISO… vorgegeben hast, macht mein FF beim Abspeichern automatisch UFT-8 daraus :wink: (sind bestimmt die ‘üs’ in ‘Über Adresse’ + ‘Menü’).

Vielleicht wär’s besser, erstmal eine normale saubere HTML-Seite mit statischen Links anzulegen, dann kannst Du mit Deinem Projekt weitermachen und Dich nebenbei in Barrierefreies Web einarbeiten.

immer wieder empfehlenswert: de.selfhtml.org/

Gruß ~ Vera

Du Vera schön das du dich damit teils befasst hast, ja kann möglich sein das FF was anderes macht, aber wie bitteschön lös ich den Fehler? ^^ Ich hab keine Ahnung und das Menü muss bis Montag funktionieren :S Sonst kann ich nix produktives vorzeigen :stuck_out_tongue: Ist eine Art Hausaufgabe xD

//edit: Hab nun nochmal die Seite einfach mit FF gespeichert und hochgeladen und von Dreamweaver eine Überprüfung gemacht…

DW meldet mir nur das hier: wutschkooo.de/testarea/ResultsReport.xml

//edit: Oke hab mal den XHTML Mist hinzugefügt (<?xml version="1.0" encoding="UTF-8" ?>

)

und Dreamweaver zeigt mir tausende Fehler, werde die erstmal beheben…

Hi,

also auf DreamWeaver würd ich nicht bauen und solange Du nicht die schon angedeuteten Fehler behebst, zB fehlender Doctype, läßt sich keine Seite validieren.

Dann nimm besser validator.w3.org/ siehe Deine Seite

Frage: mußt Du für die Schule ein barrierefreies dynamisches Menü erstellen (was ich kaum glauben kann) oder eine interessante Webpräsenz ?

~ Vera

Nachtrag: wenn Du xHtml vorgibst, aber normales Html verwendest, dann kriegst Du natürlich 1000 Fehlermeldungen. (Tip: der Doctype sagt nach welcher Scriptvorschrift sich dieses Html richtet und dann nach diesen Regeln bewertet wird)

Also ich habs geschafft das es endlich läuft :slight_smile:
Ich hab alles in

[code]

[/code] gepackt mit allen Regeln die dazu gehören und endlich läuft es.

ehm ne nicht wirklich für die Schule :smiley: Schau dir die aktuelle Seite an *** link für google entfernt ***.de und du kannst dir vorstellen wieso ich diese Seite neu erstelle ;D Einerseits wegen Verwaltung (habe ein komplettes CMS für die Seite mit PHP geschrieben) und einerseits wegen dem Layout.

Wenn man sich andere Schulwebseiten anschaut und sich für eine Entscheidung an den Webseiten orientiert geht man sicherlich nicht auf unsere :wink: Die Seite *** link für google entfernt ***.de wird immernoch mit dem Uralt-Frontpage von Microsoft Office gemacht, was schon lange veraltet ist…

In diesem Sinne bedanke ich mich für die Unterstützung und für die Tipps!

Congratulations - schreibt validator.w3 jetzt :wink3:
hai - das freut mich, dass Du die erste Hürde genommen hast

Danke auch für den ‚alten Schullink‘ - das ist tatsächlich altbacken, aber irgendwie auf Anhieb gemütlich. Kleiner Tip: irgendwas von dem Alten würde ich auch ins Neue bringen, damit man es sofort ‚wiedererkennt‘ und sich zu Hause fühlt (ggf. nochmal das HunderwasserBild in kleiner).

Viel Erfolg und Spass dabei ~ Vera

hehe ^^ Danke :slight_smile: Nur ein Problem hab ich noch, ich hab die Seite ja in zwei Tabellen gegliedert und will das die zweite Tabelle (die untere) eine höhe von 70% hat, was sich aber nicht (mehr) machen lässt mit height=“70%” , auch mit style=“height:70%;” komm ich nicht weiter…

//edit: Verdammt, hab grade bemerkt das das Menü nicht vollständig angezeigt wird… Nur im Tabellenbereich… Kann man das in den Vordergrund rücken?

  • beim Datum fehlt sicher eine tag-klammer, da man jetzt den code auf der Seite sieht (hat sich wohl gad erledigt)

  • TIP: beim Erarbeiten und Testen ist immer gut wenn man die Table mit irgendeinem border=“3” bestimmt, dann sieht man immer ganz schnell, wenn darin Fehler passiert sind, oder wo die Änderungen greifen

  • im Moment beziehen sich die % einer Tabelle ja nur auf die Tabelle selber und nicht auf die gesamte Seite - bevor Du aber eine dritte Tabelle anlegst, worin sich dann 2 Zeilen (30% 70%) mit je einer Tabelle befinden, würde ich versuchen, nur die obere, die vermutlich statisch bleibt, in der Höhe vorzugeben und die unter ohne Vorgabe zu lassen. Die würde sich dann immer an den Inhalt anpassen.

  • ich denke das overflow:hidden das Menü abschneidet

Gruß ~ Vera

Die Tabellen sind da inhaltlich falsch, die sollten ganz entsorgt
werden.

Zudem haben die ebenfalls das Potential, vom verschiedenen
browsern anders interpertiert zu werden. Das liegt daran, daß
die Tabellen verständlich darstellen sollen, daraus ergibt sich
immer die Möglichkeit, daß die ungünstige Angaben des Autors
überschreiben, um zu gewährleisten, daß tabellenartiger Inhalt
sinnvoll lesbar bleibt (selbst wenn der Autor gar keinen
tabellenartigen Inhalt in die Tabelle reingepackt hat, weil er
nicht verstanden hat, wofür Tabellen gut sind ;o)

Hi ich bins wieder… Oke also overflew:hidden schneidet das menü ab, habs gemerkt.

Aber ich hab den fehler mit height.

Wenn ich height=“30%” einbaue beschwert sich der valiator (oder wie es sich schimpft):

[quote]Error Line 79, Column 52: Attribute “height” exists, but can not be used for this element.

[/quote] und wenn ich es in ein style="height:30%;" einbaue tut sich nix.

============================================

[quote=“hoffmann”]Die Tabellen sind da inhaltlich falsch, die sollten ganz entsorgt
werden.

Zudem haben die ebenfalls das Potential, vom verschiedenen
browsern anders interpertiert zu werden. Das liegt daran, daß
die Tabellen verständlich darstellen sollen, daraus ergibt sich
immer die Möglichkeit, daß die ungünstige Angaben des Autors
überschreiben, um zu gewährleisten, daß tabellenartiger Inhalt
sinnvoll lesbar bleibt (selbst wenn der Autor gar keinen
tabellenartigen Inhalt in die Tabelle reingepackt hat, weil er
nicht verstanden hat, wofür Tabellen gut sind ;o)[/quote]

hab deinen beitrag wohl übersehen…
ehm du, ich muss gestehen ich versteh bei deinem beitrag leider nur bahnhof :frowning:

//…ah doch! will nur kurz dazu fügen das Inhalte der Seite in eine Spalte davon reinkommen. Also es gibt null inhalt außerhalb der Tabellen.

Validator heisst das Ding (Abschreiben so schwer?)

Und natürlich beschwert er sich, wenn du die Darstellung betreffende Angaben mit (veralteteten) HTML-Attributen machst - für sowas solltest du ausschliesslich CSS nutzen.

[quote]hab deinen beitrag wohl übersehen…
ehm du, ich muss gestehen ich versteh bei deinem beitrag leider nur bahnhof :([/quote]
Das ist schlecht - insb. deshalb, weil es uns keinerlei Information vermittelt, was du nicht verstehst.
Frage also in solchen Fällen bitte konkret nach - sage, was genau du nicht verstehst, dann kann es dir auch noch mal erklärt werden.
Dass du „nur Bahnhof verstehst” ist eine Aussage, die überhaupt niemandem weiterhilft.

Du willst keine tabellarischen Daten darstellen, also gibt es keinen vernünftigen Grund, eine Tabelle einzusetzen.

Schreibe strukturell sinnvolles HTML - Überschriften, Textabsätze, Listen (bspw. für die Navigation, eine Liste von Links), mit den jeweils dafür vorgesehenen HTML-Elementen.
Erstellte diese sinnvolle Struktur noch bevor du überhaupt an die später gewünschte Darstellung denkst.
Die kommt danach dran, wenn das HTML die Inhalte sinnvoll strukturiert auszeichnet - und zwar mittels CSS.

– Beitrag geht nicht zu löschen?! xP

…so hier bin ich… Hab mein Konzept nochmal überarbeitet und hoffe das es so ist wie es Hoffman in seinem Post vorgeschlagen hat…

wutschkooo.de/testarea/

ich finde nur nicht den aktuellen Fehler: Suche soll gleiche Entfernung zum rechten Rand haben wie das Datum. Entfernungen sollen möglichst gleich bleiben.

Nach flüchtigem Blick in den Quelltext wäre mein Tip, bei dem
div das Attribute align=“center” zu entsorgen.

Wenn du schon mal beim Entsorgen bist, solltest du beim CSS
auch gleich die Angaben zur font-size entsorgen, sofern da
Einheiten wie pt, px, pc drinstehen, bzw. sinnvoll durch em oder
ex oder % ersetzen.

Für Elemente, die Text enthalten, sind Angaben zur Breite und
Höhe in px-Einheiten auch oft problematisch - auch weg? ;o)

Dankesehr, das löst mein Problem mit den Schriftgrößen von dem ich (noch) nichts gesagt hatte :smiley:

Aber ein Problem hab ich noch: Das Suchfeld soll in gleicher entfernung wie die Datumsanzeige sein… Hat da jemand einen Rat?

//edit: Hab gerade bemerkt das das der Fehler nur bei einem Format von > 1024 Breite ist. Evtl durch automatischen Zeilenumbrüchen?!

Hallo,

schön, dass Du noch einen anderen Weg gefunden hast Deine Seite zu gestallten. :slight_smile:
Hättest Du mir aber früher bescheid sagen können - dann hätte ich mir viel Zeit und Mühe sparen können.

Zum Dritten und Letzten mal: die style-Tags gehören nicht in die *.css - dort verhindern sie, dass diese gelesen wird. Einen Großteil Deiner Vorgaben kommen gar nicht zum Tragen und du kannst dort ändern was Du willst - an der Seite wird dabei nichts passieren.

Frage: in welcher Entfernung von was, soll das Suchfeld sein ?
Bei mir befindet sich das Suchfeld unterhalb der Wörter ‘gleich bleiben’ und verdecken sie zum Teil.
Ich surfe nicht im Vollbild, sondern nur auf ~800 Weite.

Gruß ~ Vera

hmm…
also zu 1.: An der CSS hab ich nix geändert die ist so wie ich die von 1ngo.de kopiert hab glaub ich…
zu 2.: So seh ich die ganze Sache: http://hr-birstein.wutschkooo.de/download.php?did=48

Hi

Du brauchst nur den Browser zusammen zu schieben und dann sollte das SuchenFeld auch bei Dir runterrutschen, anstatt seine Position nur relativ zu verlagern.
Es bleibt Dir natürlich unbenommen, eine Seite so zu gestallten, dass sie nur ab frühestens 1024 ‘richtig’ zu sehen ist.

Gruß ~ Vera