IE7 ignoriert Floats bei Tumbnails

  • Hallo zusammen,

    ich habe ein Seiten-Template gebaut, auf dem Exzerpte von einigen Seiten inkl. Thumbnail ausgegeben werden.

    Klappt auch alles ganz gut. Außer im IE7. Obwohl ich das Bild nach links floate wird dies in der Dartelung vom IE7 ignoriert. Der text umfließt nicht das Bild. In Safari und FF wird alles richtig dargestellt.

    Hier mal das relevante Stück Code:

    CSS:

    #thumb {
    float:left;
    margin-top:0;
    overflow:hidden;

    }

    Seltsamerweise ignoriert der IE7 auch die CSS-Formatierungsanweisung für die Überschrift.

    Hat jemand einen Tipp für mich? Bin für jeden Hinweis dankbar.

    Einmal editiert, zuletzt von learner (14. Oktober 2010 um 15:49)

    • 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

  • gibt es denn auch eine class "alignleft" die nach links gefloated ist?

    Code
    .alignleft {
    float:left;
    }
    .alignright {
    float:right;
    }

    [size=10]Bitte immer zuerst die Forensuche nutzen und erst danach Deine Fragen hier im Forum stellen, denn sehr vieles wurde schon mehrfach beantwortet. Bitte dabei auch die Forenregeln beachten.
    Kein Support per PN - Fragen gehören ins Forum.[/SIZE]
    [size=8]Wenn du eine weise Antwort verlangst, musst du vernünftig fragen. (Johann Wolfgang von Goethe)[/SIZE]

  • der Link ?

    [size=10]Bitte immer zuerst die Forensuche nutzen und erst danach Deine Fragen hier im Forum stellen, denn sehr vieles wurde schon mehrfach beantwortet. Bitte dabei auch die Forenregeln beachten.
    Kein Support per PN - Fragen gehören ins Forum.[/SIZE]
    [size=8]Wenn du eine weise Antwort verlangst, musst du vernünftig fragen. (Johann Wolfgang von Goethe)[/SIZE]

  • Hi,

    kann den Fehler leider nicht nachvollziehen. Im IE7 ist brav Text neben Bild.

    [ot]Dieser schnelle Bildwechsel macht einen ganz wuschig im Hirn. Der Reflex gleich wieder abzuhauen ist deshalb kaum in den Griff zu kriegen.

    Äh...., ganz unten weiße Schrift auf hellblauem Hintergrund, krieg ich einen Preis wenn ich richtig rate was da steht? :mrgreen: [/ot]

  • Was bitteschön soll denn das hier sein?

    PHP
    <div class="markenpost" [COLOR=Red]<h2 id="post-<?php the_ID(); ?>[/COLOR]">

    Würde mal sagen, wenn das so im Quelltext der PHP Datei steht, dass du dann ein kaputtes Markup hast und jeder Browser anders zu reparieren versucht.
    Bring das mal in Ordnung, dann sollte auch alles funktionieren.

  • Danke für den Hinweis! :-)

    Überschriften werden jetzt korrekt dargestellt.

    Das Problem des ignorierten Floats besteht leider immer noch.

    Ich verstehe einfach nicht warum.

  • Zitat

    div in einem a ist nicht zulässig. Ein Block-Container in einem Inline-Container.

    Was meinst Du damit genau?

    Hab die Seite durch den Validator gejagt. Der spuckt mir aber recht absurde Hinweise aus. Ich dürfe keine divs mehrfach nutzen heißt es da zum Beispiel.

    Sachdienliche Hinweise habe ich nicht finden können. :???:

  • Beispiel, umgebrochen für Lesbarkeit:

    PHP
    <[COLOR=Red][B]a[/B][/COLOR] href="<?php the_permalink() ?>" 
     rel="bookmark" title="<?php  the_title_attribute(); ?>"
    > 
       <[B][COLOR=Blue]div[/COLOR][/B] id="thumb"> 
         <?php the_post_thumbnail(array(150,75), array('class' => 'alignleft'));  ?>  
       <[B][COLOR=Blue]/div[/COLOR][/B]> 
    <[COLOR=Red][B]/a[/B][/COLOR]>


    Das ist kein valides Markup, denn ein div kann nicht innerhalb eines Ankers (Link) sein. Wirf das div da raus.

  • Da stimmt was nicht im Excerpt (rot markiert, weiter rechts). Wird der generiert oder händisch eingegeben?

    Code
    <div id="excerpttext"> DIE KREATIVEN LOTSEN VOM HAFENBECKEN h1 ist eine von Marc Hillen inhabergeführte Kommunikations-Agentur in Neuss, die Kunden am gesamten Niederrhein betreut. „Wir sind kompetente Lotsen in den Bereichen Werbung, Corporate Identity und Öffentlichkeitsarbeit. Unsere Kunden genießen umfassende Betreuung von der...<a href="[URL="http://forum.wordpress-deutschland.org/view-source:http://trendguide.de/marken-produkte/h1/"]http://trendguide.de/marken-produkte/h1/[/URL]" rel="bookmark" title="weiterlesen"> weiterlesen</a> [COLOR=Red][B]</p> <p>&nbsp;</p>[/B][/COLOR]</div>

    Das kann IE nicht korrigieren und das excerpttext div floated auch nicht mit, ist also ein Block unterhalb des Links.

  • Habe jetzt

    #excerpttext mit display:inline; und

    #thumb mit display:inline-block;

    versehen und es FUNKTIONIERT! :mrgreen:

    Vielen Dank für die Hilfe! :-D:-D:-D

Jetzt mitmachen!

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