CSS-Basierendes Menü (IE Fehler?)

Nein Nein Nein, so soll das nicht gemeint sein :smiley:

Ich möchte das die Webseite dynamisch ist, d.h. auf jedem Format anzuzeigen ist… Die Webseite muss auf jedem Bildschirm perfekt sitzen ^^ nagut “fast perfekt” :smiley:

Deswegen muss ich unbedingt wissen wie ich es am besten regel…

Oder soll ich es in das div vom Datum reinmachen und einfach die Höhe justieren?

Wo ist Hoffman wenn man ihn braucht!!! :smiley:

ok
also die Suche ist doch gleichweit vom rechten Rand entfernt, da noch die Lupe als Bestandteil davon mitzählt (das Griffende der Lupe stimmt mit der Datumsentfernung überein.)

Vermutlich ist <div class=“search” … falsch positioniert. Vergleiche mal die Vorgaben mit <div class=“date”, da sie ja nah beinander sein sollen.

Ich schaue es mir Morgen nochmal an ~ gleich gehe ich zu den Geistern :wink:

Gruß ~ Vera

Ne die sind schon richtig positioniert im code… naja ich geh auch mal zu den geistern ;D
Achja… eh… die aktuelle Seite siehst du absofort unter der subdomain hr-birstein.wutschkooo.de/ weil ich den testarea-ordner ehh… gelöscht hab :wink: Naja tut auch nicht viel zur Sache…

Also nochmal zusammengefasst: www.![/u][/b])

Hinsichtlich der Probleme im Kopfbereich täte ich auch mal
dazu raten, position: relative zu vermeiden, ebenso eine
feste Höhe und auch die dort immer noch vorhandene Tabelle.

Ich denke mal, mit etwas Herumprobieren wirst du zumindest
den Kopfbereich komplett mit float und clear anständig und
robust hinbekommen.
Das ist die einfachste Lösung, wenn du wirklich oben so einen
Kopfbereich mit Bild und mehreren Textbereichen drin haben
willst, aber keine Rollbalken, wenn es eng wird.

Prinzipiell kann man auch einiges mit absoluter Positionierung
lösen. Da der Kopfbereich aber eine Höhe hat, die stark von der
Breite des Anzeigebereiches abhängt, müßte man da das Menü
entweder anders anordnen oder den Kopf in zwei Teile aufteilen,
um da eine sehr robuste Konstruktion hinzubekommen.
Mit absoluter Positionierung des Menüs (mit einer Breite in em
oder ex, nicht in px, wie derzeit) bekommt man sehr robuste
Layouts hin. Da würde man dann allerdings das Logo-Bild über
dem Menü anordnen und den Textkopf (unpositioniert) über
dem restlichen Inhalt.

Bei dem Bild der Schule bekommst du ebenfalls bei kleiner Breite
des Anzeigebereiches interessante Probleme, mal abgesehen
davon, daß sogar das alt-Attribut fehlt.
Zum einen könntest du bei dem großen Bild und auch beim
Logo Höhe und Breite explizit angeben.
Dann könntest du per CSS zudem vorsichtig formulieren:
img {width: auto; max-width:95%, height: auto}

Ich glaube ansonsten auch nicht, daß ‘Logo’ eine angemessene
Textalternative für das Logo-Bild ist. Der Wert des Attributes soll
ja äquivalent zur Bildinformation sein. Da wäre dann aber wohl
folgender Wert angemessen: “40 Jahre Haupt- und Realschule
Birstein; hr-birstein.de” - mehr kann ich da zumindest nicht
entziffern. Alternativ kann es sein, daß du meinst, daß die
Information des Bildes bereits durch den Text daneben gegeben
ist, dann wäre alt="" angemessen. alt=“Logo” weist hingegen
darauf hin, daß die Bildinformation ‘Logo’ ist, wobei nichts sonst
auf der Seite darauf hinweist, daß dort irgendwas das Thema
’Logo’ diskutiert ;o)

Tja, ein langer, steiniger Weg bis zu einer guten Seite …
Wobei es allerdings relativ einfach ist, es deutlich besser zu
machen als dieser Pseudo-HTML-Grusel auf der aktuellen Seite ;o)

[quote=“hoffmann”]Hinsichtlich der Probleme im Kopfbereich täte ich auch mal
dazu raten, position: relative zu vermeiden, ebenso eine
feste Höhe und auch die dort immer noch vorhandene Tabelle.

Ich denke mal, mit etwas Herumprobieren wirst du zumindest
den Kopfbereich komplett mit float und clear anständig und
robust hinbekommen.
Das ist die einfachste Lösung, wenn du wirklich oben so einen
Kopfbereich mit Bild und mehreren Textbereichen drin haben
willst, aber keine Rollbalken, wenn es eng wird.
[/quote]
Ich fasse Zusammen für mich:
[]Keine festen Höhen
[
]position:relativ vermeiden
[]Tabellen aller Art vermeiden.
[
]float: & clear: benutzen

[quote]Prinzipiell kann man auch einiges mit absoluter Positionierung
lösen. Da der Kopfbereich aber eine Höhe hat, die stark von der
Breite des Anzeigebereiches abhängt, müßte man da das Menü
entweder anders anordnen oder den Kopf in zwei Teile aufteilen,
um da eine sehr robuste Konstruktion hinzubekommen.
[/quote]
[*]Kopf in zwei Teile aufspalten

[quote]Mit absoluter Positionierung des Menüs (mit einer Breite in em
oder ex, nicht in px, wie derzeit) bekommt man sehr robuste
Layouts hin. Da würde man dann allerdings das Logo-Bild über
dem Menü anordnen und den Textkopf (unpositioniert) über
dem restlichen Inhalt.[/quote]
[]Keine Breiten mit px, sondern nur mit em oder ex
[
]Logo über dem Menü anordnen
[*]Textkopf unpositioniert über restlichem Inhalt

[]Alt-Attribut niemals bei Bildern vergessen
[
]Bilder verkleinern via CSS

[quote]Ich glaube ansonsten auch nicht, daß ‘Logo’ eine angemessene
Textalternative für das Logo-Bild ist. Der Wert des Attributes soll
ja äquivalent zur Bildinformation sein. Da wäre dann aber wohl
folgender Wert angemessen: “40 Jahre Haupt- und Realschule
Birstein; hr-birstein.de” - mehr kann ich da zumindest nicht
entziffern. Alternativ kann es sein, daß du meinst, daß die
Information des Bildes bereits durch den Text daneben gegeben
ist, dann wäre alt="" angemessen. alt=“Logo” weist hingegen
darauf hin, daß die Bildinformation ‘Logo’ ist, wobei nichts sonst
auf der Seite darauf hinweist, daß dort irgendwas das Thema
’Logo’ diskutiert ;o)[/quote]
[*]Sinnvolle Alt-Attribute oder ggf. leer lassen.

[quote]Tja, ein langer, steiniger Weg bis zu einer guten Seite …
Wobei es allerdings relativ einfach ist, es deutlich besser zu
machen als dieser Pseudo-HTML-Grusel auf der aktuellen Seite ;o)[/quote]
[/quote]
Muss Montag erstmal zeigen das ich das Problem mit dem Menü gelöst habe, das mir die letzte Zeit Nerven geraubt hatte… Apropos Menü… Gibt es eine Möglichkeit das Menü auf 3 Ebenen zu erweitern statt wie jetzt mit 2?

Es gibt für alles eine Lösung, die Sinnhaftigkeit eines 3-Ebenen-CSS-Menüs kann man aber durchaus in Frage stellen :ps:

position: relative muß man nicht generell vermeiden, man sollte
nur bedenken, daß damit das Element nur relativ zum
urprünglichen Ort verschoben wird, wie es angegeben ist.
Der Platz für den Inhalt wird nach wie vor am ursprünglichen
Ort reserviert. Je mehr verschoben wird, desto höher das Risiko
einer ungewollten Überlappung mit anderen Elementen.

Tabellen nicht generell vermeiden, sondern nur verwenden, wenn
es um tabellenartigen Inhalt geht (Stundenplan, Fahrplan,
korrelierte mehrdimensionale Daten etc).

Die absolute Positionierung ist eine Alternative zu dem Ansatz
mit float, nur dann bietet es sich an, das Logo getrennt über
dem Menü zu positionieren, weil man nur davon die Höhe kennt,
nicht aber vom sonstigen Textinhalt im Kopf.

Die Einheit px eignet sich für Elemente, die (nur) Pixelgraphik
enthalten. Oder wenn du Vektorgraphik (SVG) verwendest, ist
das auch eine schöne Einheit.

alt="" ist nur dann sinnvoll, wenn das Bild entweder gar keine
Information enthält oder die Information sowieso im umgebenden
Text nochmal verfügbar ist.

Menü mit n-Dimensionen - gehen tut das schon, hast du denn
so viel Inhalt? Früher habe ich ja auch noch viel Zeit in hübsche
Menüs gesteckt. Inzwischen sehen die bei mir deutlich sparsamer
aus, weil es die meisten Leute sowieso nur verwirrt, wenn die
die Wahl zwischen zuvielen Inhalten haben - oder erst lernen
müssen, wie man die Seite benutzt. Letztlich ist es nervig, daß
auf jeder Seite das Rad neu erfunden wird, damit die Leute über
ein Menü Zugang zum Inhalt bekommen. Da kann es passieren,
daß auf einer normalen Seite mehr Menü als Inhalt ist - absurd.
Das bewirkt nur Streß, da verstehe ich auch nicht diese tollen
Portale, wo man nichts findet, weil alles auf einer Seite ist.
Ein guter Seitenindex auf der Startseite zusammen mit einer
link-Navigation und einem Sparmenü auf jeder Seite scheint mir
bei den derzeitigen Fähigkeiten der browser ein sinnvoller
Kompromis zu sein.

Will nur kurz auf das mit dem Menü antworten, den rest les ich mir morgen in Ruhe durch… Ehm also ich brauch nur noch eine 3. Ebene für eine Auswahl zwischen 2 Inhalten… z.B. Schulinfos --> Abschlussprüfungen --> Hauptschule / Realschule sind nur zwei sachen die auf den 3. Ebenen liegen… Deswegen die Frage und ich weiß nicht wie ich es mit dem Menü anstellen soll…

In diesem Sinne Gute Nacht

An der gewünschten Stelle fügst du eine weitere Liste ein, z.B.
ul, ggf. mit einem div drumherum, um eine Überschrift
aufzunehmen.
Entweder über die Verschachtelung oder über eine explizite
Klassenzuweisung kannst du dann wieder :hover anwenden,
um den Inhalt der Liste dynamisch anzeigen zu lassen.

Wenn du verstanden hast, wie man ein Untermenü aufmacht,
sollte es doch leicht sein, darin noch ein weiteres aufzumachen.