XHTMLforum - div box mit image - IE / Opera Problem

XHTMLforum (http://xhtmlforum.de/index.php)

- CSS (http://xhtmlforum.de/forumdisplay.php?f=73)

- - div box mit image - IE / Opera Problem (http://xhtmlforum.de/showthread.php?t=34960)

div box mit image - IE / Opera Problem

Hallo ich habe folgendes Problem:

Auszug aus dem Quelltext:

Code:



<style type="text/css">

<!--





#p_right img{

        vertical-align: text-top;

        float: right;

        margin: 0em;

        padding: 0em 0em 1em 1em;

        overflow: hidden;

}





#p_right {

        margin: 0em;

        padding: 0em;

        overflow: hidden;

}





#p_left img{

        vertical-align: text-top;

        float: left;

        padding: 0em 1em 1em 0em;

        margin: 0em;

        overflow: hidden;

}



#p_left {

        margin: 0em;

        padding: 0em;

        overflow: hidden;

}



#p_ad {

        background: transparent;

        border: 1px solid #778;

        margin: 0em;

        padding: 0.5em 1em 0.5em 1em;

        overflow: hidden;

}



#p_reg {

        margin: 0em;

        padding: 0em;;

        overflow: hidden;

}

-->

</style>

Code:

                  <div id="p_right"> [img]images/platzhalter.jpg[/img]

            



 A un Angleso it va semblar un simplificat Angles, quam un skeptic

              Cambridge amico dit me que Occidental es.... [<a href="#">Artikel

              lesen</a>]</p>

          </div>

         

                 

                  <div id="p_left"> [img]images/platzhalter.jpg[/img]

            



 It va esser tam simplic quam Occidental: in fact, it va esser

              Occidental. A un Angleso it va semblar un simplificat Angles, quam

              un skeptic Cambridge amico dit me que Occidental es.... [<a href="#">Artikel

              lesen</a>]</p>

          </div>

         

                 

                  <div id="p_ad">

            



Ma quande lingues coalesce, li grammatica del resultant lingue

              es plu simplic e regulari quam ti del coalescent lingues. Li nov

              lingua franca va esser plu simplic e regulari quam li existent

              Europan lingues. It va esser tam simplic quam Occidental: in fact,

              it va esser Occidental. A un Angleso it va semblar un simplificat

              Angles, quam un skeptic Cambridge amico dit me que Occidental es....

              [Artikel lesen]</p>

          </div>

     

           

            <div id="p_reg">

          



Ma quande lingues coalesce, li grammatica del resultant lingue es

            plu simplic e regulari quam ti del coalescent lingues. Li nov lingua

            franca va esser plu simplic e regulari quam li existent Europan lingues.

            It va esser tam simplic quam Occidental: in fact, it va esser Occidental.

            A un Angleso it va semblar un simplificat Angles, quam un skeptic

            Cambridge amico dit me que Occidental es.... [<a href="#">Artikel

            lesen</a>]</p>

        </div>

Hier die html zum angucken:
klick mich!

Bei IE und Opera verrutschen die Divs ineinander ... hab mich ein wenig schwer getan danach zu suchen - weil ich nicht so recht weiss wie ich das Prblem nennen soll.

Die screens zeigen mein Problem...

So ist richtig im ff & safari

http://www.pharmaline.de/projekte/bu.../images/ff.jpg

In IE rutscht der Text hoch

http://www.pharmaline.de/projekte/bu...images/ie6.jpg

In Opera werden die Bilder gescshmälert

http://www.pharmaline.de/projekte/bu...ages/opera.jpg

wie kann ich das Lösen?

Vielen Dank für eure Mühen!

Gib p_ad mal ein clear:both; mit auf den Weg. Außerdem verstehe ich nicht, was das dir overflow:hidden; bringen soll. Lass das mal weg.

Außerdem denke ich fast, dass du evtl. eher mit Klassen und nicht mit IDs arbeiten solltest, da es ja durchaus mehrere gleiche Absätze geben könnte.

Mario

Und dann solltest Du den Grafiken mal die Werte für Breite, Höhe, etc. mitgeben!

Danke für euren Rat...

ansich schon ein richtiger Ansatz mit clear:both allerdings werden die Artikel im Framework der Seite komplett links gefloatet. Und wenn ich dann den Linken float "cleare" dann zerschiess ichs mir!

Das mit den Größen für die Bilder hab ich scshon ausprobiert - ändert nichts.

weitere Ideen?

Ich sehe beim Bild keine Angaben für Breite, Höhe und alt-Text!
Und ein "clear" finde ich auch nicht!

Warum sollte es dann funktionieren!

Also,
na bitte am "alt-text" wirds ja wohl nicht liegen

Und Breite und Höhe hatte ich angegeben im css (habs nur wieder rausgenommen - weil die bilder hinterher dynamisch mit unterschiedlichen Größen eingefügt werden.)

Und clear ist nicht drin - das siehst du ganz richtig - den Hinweis hab ich ja auch erst bekommen - und dann getestet - Das ganze was ich hier hochgeladen hab - ist ein auszug aus etwa 700 Zeilen css - nur das komplette Projekt darf ich nicht preisgeben - deswegen muss das nun reichen.

Zitat:

Zitat von Pharmaline

ansich schon ein richtiger Ansatz mit clear:both allerdings werden die Artikel im Framework der Seite komplett links gefloatet. Und wenn ich dann den Linken float "cleare" dann zerschiess ichs mir!

Hähhh :?: Bei dir werden doch nur die Bilder "gefloatet" und deshalb ragen Sie auch in den nächsten Absatz mit rein. Mit clear:both; im neune Absatz kannst du das unterbinden. Die anderen Darstellungsfehler dürften vom overflow:hidden; kommen. Aber das sagte ich ja alles schon und solange du das nicht änderst, kann dir wohl kaum jemand weiterhelfen.

Edit: Beim 2. mal Lesen wird mir klar, was du mit komplett links gefloatet meinst. Tja, dann hast du schlechte Karten. Besser, du passt das Framework an und positioniert evtl. einige Sachen abolut und lässt sie nicht floaten. Das erspart dir später auch viel Ärger im IE, der bei solchen Layout durch einen sehr bösen Bug absolut unmotiviert Darstellunsgfehler hat.

Mario

Hallo,
Danke dir - das Problem besteh genau darin, das ich da keinen Einfluss auf das Design hab, da muss ich mich an das gegebene halten. Deswegen - die Problematik.

Lustig ist, das NUR beim IE eine korrekte Darstellung produziert wird wenn ich clear verwende.

Na ja, jetzt kann ich wenigstens einen vernünftigen Link posten. weil das ganze Ding online gegangen ist.

Klick mich!

Vielleicht findet da ja nun jemand eine Lösung!

Danke.

Du verwendest doch XHTML 1.0 strict - Du solltest Deinen Quellcode mal validieren!

IDs doppelt vergeben, Werte ohne Anführungszeichen, etc.! Fehler können doch auch weitere Fehler provozieren!

"also hömma" - ICH hab validen Quellcode geliefert!!!

Auf alles andere hab ich keinen Einfluss - wie du ja in der Url sehen solltest is das ne WebObjects Seite - und das liegt außerhalb meines Tätigkeitsbereiches.

Ich habe zuvor das Css und das Xhtml validiert bekommen.
Und die Sachen die ich hier frage haben auch nichts damit zu tun - weil ich bestimmt nicht live teste - sondern mit einer schön validen Muster-html :D