Blog für unterschiedliche Browser anpassen

  • Hallo,

    ich habe in den letzten Wochen meine Website mit wordpress gebastelt. Dabei habe ich immer im FireFox gearbeitet. Nun ist mir zufällig aufgefallen, dass die Formatierung der sitebar im IE nicht korrekt ist. Alle Widgets, die ich benutze sind zu weit rechts. Gibt es da irgendwelche bekannten Einstellungen bzw. Parameter, die beim IE anders reagieren als beim FireFox?

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • Je nach Version ist der IE teils sehr Bug-behaftet. Testen würde ich ehrlich gesagt nur noch IE ab Version 7, es sei denn Du machst Webseiten für große Konzerne oder die britische Regierung (woah, tun mir deren Programmierer Leid *g*).

    Stell zuerst mal sicher, dass Deine Seite valide ist, damit sie im IE nicht im Quirksmode läuft: http://validator.w3.org

    Danach kann man dann schauen, was im IE genau nicht stimmt. Dafür wäre ein Link zur Seite gut, dann kann man das am lebenden Objekt testen.

  • Es sind wohl falsch verschachtelte Tags dabei. Das kann halt theoretisch die Ursache sein für unterschiedliche Darstellung in verschiedenen Browsern. Ansonsten ist es einfach so, dass man in so einer Menge an Fehlern dann die tatsächlichen Probleme nicht mehr sieht. Deswegen finde ich sollte man das so gut es geht Richtung 0 drücken. :-)

  • Hallo Ammaletu,

    ich habe es heute erst geschafft mich mit dem Fehler-Problem mal näher zu beschäftigen und bin auf http://validator.w3.org gegangen und habe dort die Seite http://augen-auf-reise.de/ gecheckt. Gleich den ersten Fehler habe ich behoben in dem ich das alt-attribut eingetragen (ist auch im Quelltext) aber der validator sagt mir immernoch das es fehlt. Wie kommt das? Habe ich was falsch korrigiert, oder braucht der validator eine gewisse Zeit zum aktuallisieren?

    -----edit-----

    ich kann meine Frage selber beantworten... Hat sich jetzt nach ca. 15 Minuten Wartezeit erledigt, die Fehler erscheinen nicht mehr in der Liste. Dann kann ich ja frohen Mutes weiter Fehler korrigieren!

  • Hallo,
    jetzt muss ich doch nochmal etwas fragen.
    Ich habe in einem Plugin (countdown-clock) scheinbar ein Problem. Zumindest habe ich diverse Fehler in Line 360. Z.B:

    Zitat


    Line 360 Column 10: document type does not allow element "li" here; missing one of "ul", "ol", "menu", "dir" start-tag <li><h3>Vacation Countdown</h3><!-- Countdown Clock widget - HTML code - …
    The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element.
    One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>").



    Die Line 360 selber sieht so aus:

    Zitat

    <li><h3>Vacation Countdown</h3><!-- Countdown Clock widget - HTML code - mycountdown.org --><div align="center" style="margin:15px 0px 0px 0px"><noscript><div align="center" style="width:140px;border:1px solid #ccc;background:#FFFCCC ;color:#000000 ;font-weight:bold"><a style="padding:2px 1px;margin:2px 1px;font-size:12px;line-height:16px;font-family:arial;text-decoration:none;color:#000000 ;" href="http://mycountdown.org/Vacation/"><img src="http://mycountdown.org/images/countries/my+countdown.png" border=0 style="border:0;margin:0;padding:0">&nbsp;&nbsp;Vacation Countdown</a></div></noscript><script type="text/javascript" src="http://mycountdown.org/wp_countdown-c…10&text1=flight &text2=Russia we are comming!&event_time=1283990400&img=&cp3_Hex=&cp2_Hex=FFFCCC&cp1_Hex=000000&hbg=0&fwdt=150"></script></div><!-end of code--></li><li> <div class="textwidget"><h3></h3>



    Nur nochmal zum verständnis: das was ich hier sehe ist doch der html-code, den mir validator.w3.org überprüft hat? Wie finde ich jetzt aber den Weg von dem html code zum fehler in der php-Datei?

    Ich hoffe ich bin einigermaßen verständlich. Ich habe nurnoch 13 Tage in Deutschland und irgendwie ist schlafen derzeit schwierig und denken noch schwieriger :smile:

  • Mal ganz grob ins Blaue geraten: Deine Sidebar verwendet keine ul- und li-Tags sondern divs oder was anderes. Das Plugin fügt aber einfach ein Widget mit einem li-Tag ein. Entweder ist die Sidebar in der functions.php falsch konfiguriert (da kann man mit optionalen Attributen angeben, in welche Tags ein Widget gepackt werden soll) oder das Plugin ignoriert diese Angaben einfach. Letzteres wäre aber schon ziemlich frech.

    Und ja, der HTML-Validator weiß nichts von PHP. Gegebenenfalls muss man sich das manuell raussuchen, aus welchem PHP-File der entsprechende HTML-Code stammt.

    Wenn ich mir die Validator-Ausgaben so anschaue, scheint das Countdown-Plugin nicht so wirklich toll programmiert zu sein. Sage ich mal so, ohne in den Quelltext geschaut zu haben. Es nimmt jedenfalls eine ganze Menge Validierungsfehler mit.

    ... So, doch noch mal auf die Seite geschaut. Woher kommt denn die Kategorienausgabe? Die stimmt auf jeden Fall nicht (li in h3 geschachtelt, leeres h3 davor).

  • Hallo,

    den Countdown-Zähler werde ich dann wohl raus nehmen. Ist eh nurnoch 10 Tage nötig :-)

    Die Kategorienausgabe habe ich als festen teil in die Sidebar gebaut, vor die widgets:

    http://forum.wordpress-deutschland.org/design/73508-r…anpassen-2.html

    Das leere h3 hat den Sinn, dass eine zusätzliche Linie erscheint...

    Der Code von diesem Teil der sidebar:

    Zitat

    <!-- *****************************Kategorien nachbauen******************************** -->
    <h3></h3>
    <h3><?php wp_list_categories('title_li=&exclude=1'); ?></h3>



    <?php /* Widgetized sidebar, if you have the plugin installed. */
    if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('sidebar') ) : ?>

    Was die divs und ul- und li-tags angeht, so gibt es beides in der sidebar. Es sind vier Klassen definiert:

    Zitat

    <div class="sidebar">
    <div class="side_top"></div>
    <div class="sidebar_top">
    <div class="sidebar_bg">

    aber es wird auch ul und li verwendet.

  • Zitat

    Das leere h3 hat den Sinn, dass eine zusätzliche Linie erscheint...

    Dass das nicht die Art ist, wie die Verwendung dieses Tags gedacht ist, kannst Du Dir sicher selber denken... ;-)

    Zitat

    Der Code von diesem Teil der sidebar:

    Dann gib doch bitte wp_list_categories nicht in einem h3 aus, es ist ja keine Überschrift. Stattdessen nimm ein ul, dann passt das auch mit den Listenpunkten, die wp_list_categories generiert.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!