Anzeigen von Iframes

  • Ich betreibe eine Seite, wo ich viele norwegische Karten als Iframe eingebunden habe. Der Iframe bezieht sich auf eine html - Seite, die ebenfalls auf meinem Server liegt.
    Bei etlichen Seiten erscheint der Iframe jetzt mit einer Höhe von 100 und weniger, obwohl der code folgendermaßen aussieht:

    <center>
    <p><iframe src="https://www.suednorwegen.org/karten/angeln-sokna.htm" width="98%" height="850">Oh, Ihr Browser zeigt keine Iframes an; dann klicken Sie bitte <a href="https://www.suednorwegen.org/karten/angeln-sokna.htm" target="_blank" title="alternativer Link zur Karte">hier</a>!</iframe></p>
    </center>

    Editiere ich die Seite mit Firefox wird, height beim Speichern auf 100 zurückgesetzt. Bei Chrome oder Edge ist das nicht der Fall.

    Nun das verwunderliche:
    überschreibe ich den Code mit diesem Code:
    <center>
    <p>
    <iframe height="850" src="https://suednorwegen.org/karten/angeln-sokna.htm" width="98%">Oh, Ihr Browser zeigt keine Iframes an; dann klicken Sie bitte <a href="https://suednorwegen.org/karten/angeln-sokna.htm" target="_blank" title="alternativer Link zur Karte">hier</a>!</iframe></p>
    </center>

    wird das angenommen und die Seite wird richtig angezeigt.

    Es handelt sich beim Beispiel um diese Seite, die ich noch nicht bearbeitet habe:
    https://www.suednorwegen.org/index.php/sues…al-sokndalselva

    Etliche Seiten habe ich inzwischen neu gemacht, nur bei über 300 Kartendarstellungen ist das eine mühselige Angelegenheit, vor allem, wenn ich nicht sicher sein kann, dass der neue Codeschnipsel in Kürze dann auch wieder nicht anerkannt wird.
    Vor allem, wo ist der Unterschied der beiden Iframes und warum nur bei Firefox?


    Gruß
    Horst


  • Nun das verwunderliche: [...]


    Das hat jetzt nicht unbedingt viel zu heissen. Wenn ich einen Reload mache, zeigt er mir das iframe auch korrekt an. Oder eben auch nicht... :P

    Firefox hält sich relativ strikt an die Spezifikationen.
    Was nun bei deinem iframe-Code auffällt:
    - Soweit ich weiss, sind Prozentangaben hier nicht erlaubt.
    - Soweit ich weiss, sind Texte innerhalb des iframe-Elements nicht erlaubt

    Chrome oder Edge scheinen das zu tolerieren. Evtl. hat auch FF das bisher toleriert und macht das möglicherweise auch zukünftig wieder. Da würde ich mich aber nicht drauf verlassen.
    Vielleicht liegt der Fehler auch gar nicht hier.
    Ich persönlich würde nach Möglichkeit gar kein iframe verwenden und die Karte direkt auf der Seite einbinden.
    Alternativ würde ich beim iframe auf Grössenangaben verzichten und das iframe dafür mit einem Block-Element umfassen, welches die Grössenangaben enthält.
    Also etwa so (wobei das CSS hier nur beispielhaft inline steht und natürlich ausgelagert sein sollte):

    Code
    <div style="width: 98%; height: 850px;">
    <iframe src="https://www.suednorwegen.org/karten/angeln-sokna.htm"></iframe>
    </div>

    Windows 10 | FF 62.0 (64-Bit) / FF 61.0 (64-Bit) / FF 63.0 (64-Bit)

  • Sicher sind Prozentangaben im Breiten-Attribut erlaubt. Ich wüsste jetzt spontan nicht, bei welchem Element sowas nicht erlaubt wäre. Auch Texte innerhalb des öffnenden und schließenden iFrame-Tags sind erlaubt. Das ist sogar ein ziemlich wichtiges Feature für Nutzer von Screenreadern.

    Ich kann auf der verlinkten Seite kein Problem nachvollziehen (macOS, Firefox 60 Nightly). Der iFrame hat hier eine Höhe von 850px, wie im Code angegeben (854px mit den Rändern).

  • EffPeh: Ich habe mich von dem falschen HTML im ersten Beitrag in die Irre führen lassen. Da steht "<center>", was es nur in HTML4 gibt, also ging ich davon aus, dass hier HTML4 geschrieben wurde. Ich habe nicht nachgesehen, was der Doctype des Dokuments ist. Der ist tatsächlich als HTML5 angegeben. Ein wichtiger Unterschied, denn beides, was ich schrieb, stimmt in der Tat nicht für HTML5, aber beides stimmt für HTML4.

  • @Sören:
    Ja, so sicher war ich mir da nach deinem Post auch nicht mehr. :P
    Neben center gibt es auch noch font. Aber naja, ist schliesslich eine private Geschichte.
    Und wie gesagt: es muss nicht unbedingt daran liegen und kann auch ganz andere Gründe haben.

    Windows 10 | FF 62.0 (64-Bit) / FF 61.0 (64-Bit) / FF 63.0 (64-Bit)

  • Hier unter Linux macht die Seite auch keine Probleme, Höhe ist OK (über 800px, nicht genau gemessen). OT: Schweden und Norwegen sind übrigens auch zwei unserer bevorzugten Urlaubsziele...

    Gruß Harry

    FF aktuell, 64Bit, Linux, Manjaro mit KDE

  • Mit meinem normalen "Arbeitsprofil", das eine Menge Addons und natürlich auch einige Konfigurationsänderungen beinhaltet, habe ich auch keine Probleme mit der Darstellung. Kurioserweise sieht die Seite in einen neuen (unveränderten) Profil aber genauso wie bei Horst aus. :-??
    (Firefox 58.0.2, Linux)

  • Ja, das bestätige ich hiermit auch. Bei einem neuen Profil, aber auch wenn mit meinem richtigen Profil nur im abgesicherten Modus ohne Addons starte, ist der Fehler deutlich da...

    Gruß Harry

    FF aktuell, 64Bit, Linux, Manjaro mit KDE

  • Hallo Nachbar Hoddel (bei etwa 1km Luftline zu Deinem See kann man ja Nachbar sagen).

    Die 850 Pixel Höhe stehen ja direkt im HTML-Text. Kann das evt durch irgendwelche CSS Angaben verändert werden? In Deinen CSS-Dateien habe ich nichts gesehen. Hast Du was von Google oder so eingebunden was durch uBlock und Co verhindert wird? So daß der Fehler dann nicht auftritt? Wenn in einer solch ftremden CSS-Dateie die Iframe-Höhe auf 100px gesetzt ist???

    Gerade getestet:

    Wenn ich in einem neuen Profil ganz ohne Addons die Seite aufrufe ist das Iframe nur ca 100 Pixel hoch. Wenn ich dann in den Einstellungen den "Schutz zur Aktivitätenverfolgung" auf "immer" stelle und neu lade, dann wird das Iframe richtig angezeigt. Das reicht also schon um irgendwas zu hindern...

    Gruß Harry

    FF aktuell, 64Bit, Linux, Manjaro mit KDE

  • Moin Nachbar,
    google analytics läuft bei mir nicht, weil ich da etwas gegen habe. Ob google adsense das verursacht, da bin ich überfragt.
    Das kann auch mit Joomla zusammen hängen. Habe vorhin einiges darüber gelesen, dass es Schwierigkeiten mit YouTube Einbindungen gibt. Die werden nicht mehr angezeigt. Sind ja auch Iframes.

    Ich werde wohl oder übel alle Seiten neu gestalten müssen. Denn so kann ich die Seiten nicht lassen. Jedes Jahr etwas neues. Letztes Jahr wurden in Norwegen die Karten-Layer umbenannt. Hat auch Tage gedauert, bis alles fertig war.

    Trotzdem vielen Dank an alle.

    Gruß
    Horst

  • Versuch doch mal eine zusätzliche CSS-Regel mit einzubinden, evt mit !important, vieleicht wirkt das ja Wunder. Etwa so:
    p > iframe { height: 850px !important; } geht natürlich nur wenn es nicht noch anderte Iframes mit anderer Höhe gibt. Das müßte man doch auch einfach mit Stylus testen können... oder in der userContent.css...

    Gruß Harry

    FF aktuell, 64Bit, Linux, Manjaro mit KDE

  • Kannst du evtl. noch mal den obigen Code so ergänzen?

    Code
    <div style="width: 98%; height: 850px; min-height: 850px; max-height: 850px; background: red;">
    <iframe src="https://www.suednorwegen.org/karten/angeln-sokna.htm"></iframe>
    </div>

    Nur mal, um sicherzustellen, dass das div tatsächlich immer die 850px Höhe bekommt.

    Windows 10 | FF 62.0 (64-Bit) / FF 61.0 (64-Bit) / FF 63.0 (64-Bit)

  • Ich habe den Grund gefunden:
    Gebe ich die Werbung auf den Seiten mit AD Block frei, werden die Iframes fehlerhaft angezeigt, weil die meiste Werbung von Google das Tracking aktiviert hat. Da kann ich tagelang am Code "rum popeln". Das gilt auch für den Edge, nicht aber für den Chrome.
    Ich habe jetzt 2 Möglichkeiten:

      Die beiden Werbeblöcke von Google entfernen.

      Alle Kartenseiten neu gestalten

    Ich werde wohl die zweite Variante wählen müssen, da ich sonst keinen Ausgleich zu den Serverkosten habe.

    Schön wäre es natürlich, wenn beim Ad Block zwischen Iframe und Werbung differenziert werden würde.

    Alle Versuche, am Code etwas zu verändern sind ohne Ergebnis.

    Vielen Dank
    Gruß
    Horst

  • Hast Du das mit der Angabe in der CSS-Datei mal getestet? Ich habe gerade noch mal getestet: Wenn ich z.B. in der userContent.css (im Profilordner/chrome/) eine solche Regel (die gilt natürlich dann für alle Webseiten) reinschreibe, dann hat diese Vorrang und die 850 Pixel Höhe stimmen dann hier auch mit sonst neuem Profil. Ich habe da testweise einfach mal "iframe { height: 850px; )" reingeschrieben, das reichte. Das geht natürlich nur wenn nicht noch andere iframes verwendet werden. Den Iframes hast Du ja anscheinend leider keine ID oder Klasse zugeordnet, sonst könnte man es daran besser selektieren.

    Gruß Harry

    FF aktuell, 64Bit, Linux, Manjaro mit KDE

  • Es hilft ja nicht den Besuchern meiner Seite. Ich muss die Seite ja so darstellen, dass es bei ihnen mit allen Browsern so sichtbar ist, wie ich es möchte. Da ich mit dem Fox überwiegend arbeite ist mir die Fehldarstellung natürlich im Fox aufgefallen. Erst später stellte ich fest, dass es auch mit Edge und IE11 so ist, wenn man die Treckingsperre eingeschaltet hat.

    Google stellt etliche Werbeblöcke ohne Analytics zur Verfügung. Das sind dann die Fälle, wo die Höhe des Iframes einwandfrei dargestellt wird. Es liegt also nicht am Code, sondern an der Werbung mit Analytic in dem Iframe.

    Gruß
    Horst