nicht angemeldet
Hallo Susanne,
ein paar Anmerkungen zum Stylesheet:
Dein Layout mit den den float und position:relative kann ich nicht ganz nachvollziehen, das heißt, vielleicht ließe es sich auch einfacher lösen, es scheint aber zu funktionieren, wie es auf MSIE 5.x aussieht, konnte ich nicht prüfen, aber ich denke, dass du daran gedacht hast (anderen Boxmodell...).
Anstatt »font-family:verdana,arial,serif« suchst du wahrscheinlich »font-family:verdana,arial,sans-serif;«, weil wohl eine serifenlose Schriftfamilie verwendet werden soll, wenn Verdana und Arial nicht verfügbar sind. Siehe auch http://selfhtml.teamone.de/css/eigenschaften/schrift.htm#font_family.
Einige Klassen im CSS scheinen bisher mir unbenutzt, am Ende solltest du das Stylesheet soweit wie möglich auf das Nötige reduzieren.
Anstatt jedem th- und td-Element ein class-Attribut zu verpassen, kannst du einfach einen anderen Selektor wählen, um alle th- bzw. td-Elemente in einer Tabelle mit class="maison" zu adressieren:
.maison th { ... }
.maison td { ... }
oder
table.maison th { ... }
table.maison td { ... }
Genauso bei #calendar/.calendar und .preise.
Anstatt <td class="calendarHeader">M</td> könntest du <th><abbr title="Montag">M</abbr></th> notieren und dann die Styles über #calendar th, .calendarHeader { ... } vergeben (falls ich mich nicht irre).
Das div um die Kalendertabelle brauchst du eigentlich nicht, du könntest dem table-Element direkt die Styles des #calendar-divs zuweisen, die th- und td-Elemente wie gesagt über Nachkommensselektoren adressieren. Vielleicht gehst du von grün (frei) aus und vergibst nur für rot (belegt) eine Klasse.
Du könntest die Tabellen mit caption, thead, tbody, scope- und summary-Attributen et cetera noch zugänglicher machen, siehe:
http://selfhtml.teamone.de/html/tabellen/nicht_visuell.htm
http://www.w3.org/Consortium/Offices/Germany/Trans/WAI/webinhalt.html#gl-table-markup sowie zugehörige »Techniques«
http://www.w3.org/TR/html401/struct/tables.html#h-11.4
(Ist nicht unbedingt wichtig, aber wo du die Barrierefreiheit schon erwähnst...)
Die Klassen für Links hast du im Stylesheet falsch notiert, die Pseudoklassen sollten nach den Klassenselektoren notiert werden, also a.head:link statt a:link.head usw. Siehe auch das ausgebene Stylesheet des CSS-Validators http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fwww.sedion.de%2Fmaisonet_demo%2Fcss%2Fmaison.css&warning=2&profile=css2.
Du hast für einige Regeln dieselben Styles vergeben, diese Regeln kannst du zusammenfassen, indem du die Selektoren hintereinander notierst, beispielsweise:
a.head:link, a.head:visited, a.head:active { ... }
(Wobei gelesene Links anders formatiert sein sollten als ungelesene.)
Bei folgendem ist es ähnlich:
a:link.logo{text-decoration: none;}
a:visited.logo{text-decoration: none;}
a:active.logo{text-decoration: none;}
a:hover.logo{text-decoration: none}
Falls hier überhaupt die Unterschreichung abgeschaltet werden muss, sollte a.logo:link {...} reichen, ansonsten können die Regeln wie gezeigt zusammengefasst werden.
Schau dir die Seite im Opera 6 und 7 an, du wirst merken, dass Opera 6 die Styles für :link nur teilweise anwendet. Deshalb solltest du jeweils auch a.klasse die Styles zuweisen, welche aus dem Link ein Blockelement machen, dann funktioniert es auch im Opera 6.x. Das wäre dann beispielsweise:
a.head, a.head:link, a.head:visited, a.head:active { ... }
In der Regel mit a.klasse:hover brauchst du dann auch nur die sich von der Standardanzeige unterscheidenden Eigenschaften notieren (bspw. Rahmen und Hintergrundfarbe), nicht alle Styles wiederholen. (Die Notwendigkeit von a.klasse als zusätzlichen Selektor für diesen Effekt habe ich nicht weiter untersucht, eigentlich sollten die Eigenschaften von a.klasse:link auch so auf a.klasse:hover vererbt werden.)
Neben dem weißen Logo ist noch hellgelber Raum, das sieht etwas unschön aus.
Die Abstände des p-Elements im in einem div der Klasse navih (speziell geht es um »Verbringen Sie Ihren Urlaub mit uns in folgenden Regionen«) solltest du ausdrücklich abschalten (siehe Opera): .navih p {margin:0;}
Wie Chräcker sagt, springen die Link-Buttons (Regionnavigation), im Opera 7 komplett, weil komischerweise standardmäßig zwischen Links und dem darüberliegenden Absatz bzw. div der Klasse navih ein Abstand angezeigt wird, welcher aber mein Mouseover verschwindet und der Block mit Links ruckartig nach oben springt. Wenn ich meine Änderungen richtig nachvollziehe, sollte .navih p {margin:0;} dies unterbinden.
Das andere angesprochene Springen ist das plötzliche Auftreten von Rahmen bei :hover. Bei a.head hast du wohlwissentlich standardmäßig »unsichtbare« Rahmen gestzt, dies kannst du bei .reg natürlich nicht wiederholen, weil bei Rahmen oben und unten in der Farbe des Hintergrunds die roten Seitenränder unterbrochen werdne würden. Da musst du dir eine andere Lösung einfallen lassen, eventuell die Seitenränder aufgeben...
Rechne noch einmal die Breite von #menus durch, ein Element der Klasse navih darin ist bereits 1+4+134+4+1=144 Pixel (border-left + padding-left + width + padding-right + border-right) breit. Vielleicht ist das der Grund, warum das padding-right von .navih im Opera nicht umgesetzt wird und der Text am rechten Rand zu kleben scheint.
Dunkelblau auf Blau ist ziemlich schlecht lesbar...
Normalerweise verwendet man das h1-Element nur einmal im Dokument als Titel, also wäre für »Lage:«, »Ausstattung:«, »In der Nähe« usw. en h2-Element passend (Überschrift zweiter Ordnung).
Für die .maison-Tabellen würde ich border-collapse:collapse verwenden. Und anstatt einer Spalte »Details« würde ich den Namen des Hauses als Link auszeichnen. Anstatt »Wir haben für Sie x Objekte in der Region y zur Auswahl:« würde ich als h1-Überschrift »Ferienhäuser in der Region y« wählen (wie im title-Element) und den genannten Satz in einen normalen Absatz schreiben.
Denke auch an die Besucher, die über Suchmaschinen kommen - vielleicht solltest du zusätzlich zu »Aquitaine« et cetera »(Südfrankreich)« bzw. »(Südwestfrankreich)« oder ähnliches notieren, da dies wahrscheinlich Suchbegriffe sein werden.
Soweit erst einmal...
Grüße,
Mathias