Falsche CSS-Darstellung

  • Ich habe ein Problem mit falsche CSS-Darstellung.

    Auf meiner Webseite http://www.fotosverkleinern.de kann man Fotos und Bilder einfach
    verkleinern.
    Um die Navigation zu realisieren habe ich mich nicht fuer Frames sondern
    fuer CSS entschieden. Folgender Code haelt die Navigation links:

    Code
    #left 
    {
    	float: left;
    	width:150px;
    	padding: 5px;
    	margin-top:0px;
    }

    Allerdings hatte ich eigentlich urspruenglich argin-top:-80px; und das Logo
    (der kleine Bonsai) hat sich nach oben verschoben.
    Unter FF sah das ganz gut aus, aber der I-Exploder zeigt es so an,
    dass es oben abgeschnitten ist. :(
    Ist das jetzt eine falsche Implementierung durch FF (negative Werte) oder ist der I-Explodierer schuld?
    Gibt es einen generellen WEg, das Problem zu umgehen?

    Schone Gruesse
    Armin Berents


    :x:x

  • Zitat von fotorama

    Ist das jetzt eine falsche Implementierung durch FF (negative Werte) oder ist der I-Explodierer schuld?

    Wenn es einen Unterschied zwischen IE und Firefox gibt, liegt das Problem in 99% aller Fälle beim IE. (Natürlich gibt es auch ein paar Anzeigefehler beim Firefox, aber die sind bei den vielen massiven Fehlern des IE zu vernachlässigen.)

    Ich bin jetzt zu faul, mir den Code anzugucken.

  • Opera zeigt es auch anders an, da sind sich die Browser aber mal gar nicht einig ;)

    Wie wäre es denn mit diesem CSS:

    Geht bei mir im IE7 im Opera 9.2 und Fuchs 2.0

  • Zitat von JonHa

    Du meinst sicher 15px. ;)

    Meinetwegen auch das ;)

    oder einfach so

    Code
    body { margin-left:10px; margin-right:50px; margin-bottom:100px }
    #left 
    {
    	float: left;
    	width:150px;
    	padding: 5px;
    	margin-top:0px;
    }
  • *nochmal aufwärm*

    Das mit "style='float:left'" klappt bei mir mit FF 2.0.0.4 definitiv nicht. Die hier gewählte Lösung "position:absolute" wiederum löst beim IE seltsames Verhalten aus, wohingegen "style='float:left'" sowohl beim IE wie auch bei Opera das tut, was es soll. Nur nicht beim FF 2.0.0.4. *grml*

    Kann das irgendwer bestätigen? Wobei ich sagen muß, daß mir bei den FF-1.x-Versionen sowas eigentlich nie aufgefallen wäre.

    Grüße
    Nemetona

    Nicht jeder, der aus dem Rahmen fällt, war vorher im Bilde.

  • Zitat von bejot

    Ein Link zu deinem Problem wäre vorteilhaft ...

    Momentan schwierig, da das "Problem" wegen akuter Baustelle noch nicht in der großen weiten Welt online ist. Ich bastle derzeit mit rein lokalen WWW-, PHP- und MySQL-Versionen; die Site darf erst zu einem bestimmten Stichtag online gehen.

    Der Versuch, eine hier einfügbare "Kurzform" zu erzeugen, ging (natürlich?) insoweit schief, als diese "Kurzform" korrekt angezeigt wird. *hmpf* Mein Verdacht, daß die dort fehlende Anbindung an die *.CSS-Datei die Sache bereinigt, hat sich nicht bestätigt: Anbindung hergestellt, und es klappt nach wie vor.

    Unnötig zu erwähnen, daß ich die Syntax in meiner nicht funktionierenden PHP-Site ungefähr 43 mal (+/- 5 mal) überprüft und für fehlerlos befunden habe. Auch mein Editor meckert keinen Grund zur Beschwerde an. Allein: Mit IE 7 und Opera 9 wird die Site korrekt angezeigt, mit FF 2.0.0.4 nicht. *seufz*

    Ich werde mir eine Möglichkeit überlegen, die Site zu Testzwecken irgendwie halböffentlich online gehen zu lassen. Vielleicht bin ich ja wirklich nur blind und übersehe schon zum fünfzigsten Mal fehlende Anführungsstriche. :?

    Grüße
    Nemetona

    Nicht jeder, der aus dem Rahmen fällt, war vorher im Bilde.

  • Validatoren (http://validator.w3.org oder http://www.validome.org)sind zum testen viel sinnvoller, als Editoren oder Brain. Editoren traue ich nur so weit, wie ich sie werfen kann (was bei Software bekanntlich ein Problem darstellt) und Brain ließt nur, was es sehen will.

    Allerdings: Validatoren prüfen natürlich nicht die Logik, sondern nur die Syntax. Wenn also irgendwo ein Logikfehler drin steckt, kommt man an Brain nicht vorbei.

    Ohne sich das ganze anschauen zu können, kann man dazu aber wirklich nichts sagen. Und das IE7 irgendwas "richtig" darstellt heißt gar nichts. Auch der 7er IE ist eine Totgeburt, die immer noch haufenweise Fehler in der Darstellung hat. Opera 9 ist dafür allerdings schon etwas anderes. Aber auch hier hat mich die Vergangenheit gelehrt: Im Zweifel hatte in 99% der Fälle Mozilla die logischere und damit richtigere Antwort.

    Sich auf die anderen Browser zu verlassen, heißt hier also nicht viel. Lieber raus finden, was genau Mozilla nicht mag und dann einschätzen (Bugs in Mozilla sind schließlich nicht unmöglich!), wer die Logik richtig hat.

    Und dann nach einem Walkaround suchen. ; )

  • So, jetzt bin ich völlig konsterniert. :shock:

    PHP und Datenbank hin oder her - was hinten rauskommt, muß ja eindeutig valides HTML sein, sonst stimmt was nicht. Wenn ein Browser aber nicht das anzeigt, was man erwartet, erhärtet das die Vermutung, daß sich irgendwo nicht valides HTML rumtreibt. Also bin ich hergegangen und habe den ausgeworfenen Quelltext (der natürlich die PHP-Bestandteile nicht mehr enthält) durch http://validator.w3.org/ geschickt. Ergebnis: Mit drei kleinen Ausnahmen
    1. td geöffnet, aber th geschlossen
    2. zwei span auf statt eines auf, eines zu
    3. per URI übergebene PHP-Variablen (?cntr=1&prod=0)werden angemotzt
    ist die Syntax korrekt.

    Konsequenterweise gibt der als HTML-Site abgespeicherte Quelltext auch eine korrekte Anzeige im FF - und das sowohl in der Fassung vor Korrektur der oben angemeckerten Fehler wie auch in der Fassung nachher. Das läßt mich jedoch einigermaßen ratlos in der Landschaft stehen: Wie kann ein per PHP erzeugter und als HTML gespeicherter Quelltext valides HTML sein und korrekt angezeigt werden, wenn während der Erzeugung eben dieses Quelltextes die Anzeige nicht korrekt ist?

    Ratlose Grüße
    Nemetona

    Nicht jeder, der aus dem Rahmen fällt, war vorher im Bilde.

  • Drück doch mal F5 wenn du die Seite vom Server geladen hast, und schau ob sie dann korrekt angezeigt wird.

  • Nö, wird nicht. Wäre ja zu einfach. Die ganzen Geschichten mit Cache löschen und Cache auf 0, sogar ein

    Code
    meta http-equiv="expires" content="0"

    habe ich schon durch - völlig ergebnisfrei.

    Grüße
    Nemetona

    Nicht jeder, der aus dem Rahmen fällt, war vorher im Bilde.

  • Zitat von Nemetona

    Wie kann ein per PHP erzeugter und als HTML gespeicherter Quelltext valides HTML sein und korrekt angezeigt werden, wenn während der Erzeugung eben dieses Quelltextes die Anzeige nicht korrekt ist?


    Kommt ein wenig drauf an, wie schnell die Seitendarstellung ist (html wird ja nur ausgeliefert, über php müsste diese seite ja erst generiert werden. evtl. hast du die html-seite auch lokal getestet, wo der zugriff erheblich schneller wäre). Weil Firefox fängt bereits nach kurzer Zeit an, die ersten erhaltenen Quelltext-Teile anzuzeigen, auch wenn noch was fehlt. Dann muss die Seite natürlich "nachgerendert" werden, wenn die restlichen Teile eintrudeln. Das KANN/KONNTE zu Fehler beim "nachrendern" führen. Es gab mal einen Bug, der so genannte "Slashdot-Bug", der vor allem beim Zusammenspiel mit Relativen größen und auch FLoats aufgetreten ist. Der ist mit Fx1.5 aber behoben worden (offiziell). Ich mag aber nicht ausschließen wollen, dass dieser Fehler unter ganz bestimmten umständen immer noch auftritt.

    Aber das kann man alles nicht sagen oder testen, solange du dazu nichts als testcase bereitstellst. ergo: alles nur ein schuss ins blaue. keine garantie auf irgendwas.

    Wenn wir gegentesten könnten, könnte wir prüfen, ob der fehler generell besteht (also entweder ein genereller fehler vom Firefox oder deines Quelltextes), oder evtl. du nur einen "defekten" firefox hast. fehlerhafte anzeige kann auch durch erweiterungen, firewalls oder ein defektes profil entstehen.

    Zitat von Nemetona

    3. per URI übergebene PHP-Variablen (?cntr=1&prod=0)werden angemotzt
    ist die Syntax korrekt.


    & ist ein Sonderzeichen. Einfach mit & maskieren.

  • Nach einigen Verrenkungen ist mein Problem jetzt online. Allerdings mit garantiert häßlichen Grafiken und mit garantiert vielen Baustellen, was aber dem Test keinerlei Abbruch tut.

    Hier: http://www.conetek.de/Stars/ findet sich die - unfertige!!! - Testversion. Das Problem tritt auf, wenn man oben in der (noch absolut häßlichen) Grafik auf einen Button der 5er-Reihe klickt und danach links ein Produkt auswählt. Opera 9.01 und IE 7 zeigen das Produktblatt rechts neben der Übersicht an, FF 2.0.0.4 konsequent darunter.

    Bitte zeitnah testen, da der notwendige SQL-Server eine 24-Stunden-IP hat, die am 06.06.2007 um 9:30 Uhr wechselt.

    Grüße
    Nemetona

    Nicht jeder, der aus dem Rahmen fällt, war vorher im Bilde.

  • Es liegt in jedem Fall am angezeigten Produktbild. Weiter bin ich mit dem Testen noch nicht gekommen...

    EDIT: Liegt wohl auch an der Schriftgröße. Wahrscheinlich ist bei zu großen Schriftgrößen einfach kein Platz die beiden Tabellen nebeneinander zu floaten sodass die 2. umgebrochen wird. Verbleinere mal testweise die schirftgröße im Firefox mit Strg+Minus, dann wird die Seite auch "richtig" dargestellt.

  • Es graust mir wenn ich den HTML-Code sehe.

    Mach erst mal die Fehler raus, überlege Dir eine sinnvolle Struktur und lerne
    HTML. Es ist nicht soooo schwierig. Es gibt da genug Quellen, zB selfhtml oder so.

    Grüße aus dem Spessart, Joe

  • Du benutzt für beide Tabellen zwei Klassen: "ohne" und "float"
    Für die 2. Tabelle würde ich die Klasse "float" streichen also:

    <table>
    .....
    </table>

    dann rutscht bei mir die 2. Tabelle zumindest schon einmal neben die andere.

  • Bei mir sieht folgendes CSS ganz gut aus, aber das ist wiederum nur im Firefox 2.0.0.4 getestet.

    EDIT: unter der Voraussetzung das die zweite Tabelle das class Attribut wie im vorangegangenen Post bekommt.