Fehler mit clip in Opera und IE
Robert
- css
Hallo zusammen,
Ich bin zur Zeit dabei meine Seite komplett neu aufzubauen. Die Seite soll komplett mittels css aufgebaut sein, ohne Javascript, Flash oder ähnlichem auskommen und nach Möglichkeit barrierearm sein. Klappt bisher soweit ganz gut(denk ich mal), nur hab ich, bedingt durch die Seitengestaltung ein 'kleines' Problem mit der clip-Funktion im Stylesheet.
CSS-Auszug:
div#links a:hover span
{
display: block;
position: absolute;
top: 6px;
left: 0;
right: 145px;
width: 700px;
padding: 5px;
margin: 0px;
z-index: 100;
color: #003;
background-color: #99c;
font: 1em Verdana, sans-serif;
text-align: left;
text-indent: 143pt;
clip: rect(auto auto auto 165px);
}
So (obwohl clip so nicht valide ist) funktionieren sowohl IE, Firefox und Opera (aktuelle Versionen)
Mit dem validen
clip: rect(auto, auto, auto, 165px)
kann Opera nicht wirklich was anfangen und überdeckt dabei das linke Menü.
Ein ähnlicher Fehler, diesmal IE, hab ich wenn ich div#links a:hover span und div#links a:focus span zusammenfasse. Jetzt überdeckt der IE das linke Menü.
zur Demonstration hab ich auf diesen Seiten die verschiedenen Hauptgruppen mit unterschiedlichen css versehen.
Startrubrik in der alle 3 Browser funktionieren:
http://www.robokopp.de/newdesign/index.php
Operafehler nach Gruppierung:
http://www.robokopp.de/newdesign/grafik/index.php
IE-Fehler nach Validierung:
http://www.robokopp.de/newdesign/composite/index.php
Was sollte ich ändern, um den Fehler (falls er von meiner css stammt) zu korrigieren?
btw. Meinungen, Verbesserungsvorschläge oder Anregungen zu der Seite sind ebenfalls willkommen (oder sollte ich dies besser als eigenen Post starten?)
Danke
Robert
Hallo Robert,
Operafehler nach Gruppierung:
http://www.robokopp.de/newdesign/grafik/index.php
IE-Fehler nach Validierung:
http://www.robokopp.de/newdesign/composite/index.php
Ich habe zwar beim Besuch deiner beiden Links keinerlei Unterschiede feststellen können, egal, ob ich sie nun mit IE6 oder Opera 8.01 aufgesucht habe, aber clippen kann man natürlich auch über einen Umweg, nämlich über overflow:hidden
in Verbindung mit position:relative
.
Bei folgender Studie hatte Opera auch Probleme, wenn ich mit bottom:0;
arbeitete. Aber es geht ja auch mit einem dynamisch berechneten Top-Wert. Was man für Opera nicht alles tut...
http://www.lernspielwiese.de/klapptabelle/klapp.html
Gruß Gernot
Hallo Gernot,
Der Fehler tritt erst beim überfahren des linken Menüfeldes mit der Maus auf. Der nun eingeblendete Infotext muß abgeschnitten werden, was er in den angegebenen Fällen nicht tut.
getestet mit IE 6 und Opera 8.5
Gruß,
Robert
hi,
Klappt bisher soweit ganz gut(denk ich mal), nur hab ich, bedingt durch die Seitengestaltung ein 'kleines' Problem mit der clip-Funktion im Stylesheet.
Ich kann nicht erkennen, wofür du da clip brauchst.
Da du es für span unter a:hover benutzt, vermute ich es geht um den roten rechten Rahmen für die Links beim überfahren?
gruß,
wahsaga
Hallo,
Sorry, ich war wohl etwas ungenau. Es geht um den span bei a:hover bzw. a:focus, der die Zusatzinfos oben einblendet. Wenn man mit der Maus über das linke Menüfeld fährt, wird der obere Teil (das Logo) des Menüs durch den DIV-block mit den Zusatzinfos überdeckt. Um dies zu verhindern, benutze ich clip. Ich schneide damit den linken Teil des span-Blocks ab.
Wenn Du im Topmenü z.B. Grafik auswählst und dann einen Link im linken Menü überfährst, sollte der Fehler in Opera (8.5) zu sehen sein.
IE 6 produziert ihn bei composite.
Gruß,
Robert
Hi,
Es kann ja sooo einfach sein!!
Einfach die Angaben zum Hintergrund entfernen und schon ist Ruhe.
Allerdings bleibt der Fehler weiterhin mysteriös für mich. .. wie so einiges was mit verschiedenen Browsern zu tun hat ;)
Trotzdem würden mich Eure Meinungen bzw. Verbesserungsvorschläge zur Seite interessieren.
Ein bereits geplanter Punkt ist sicherlich die Änderung der Menüs zur Listenform um die Anzeige im Textmodus zu verbessern.
Eine Übersichtsseite soll ebenfalls noch kommen und in der css werden noch diverse Punkte zusammengefasst.
Sonst noch eine Idee/Anregung/Vorschlag zum Design, Barrierefreiheit, oder generell?
Gruß
Robert