IE6 - Fehler nach Float

Computer: Software & Programmierung HTML & CSS
#1

Hallo alle zusammen …

habe da n Problem mitm IE6. Auf FireFox funktioniert es blendend. Und is auch schon genauso wies aussehen soll. Nur beim IE6 istn kleiner makel.

Und Zwar gehts darum:
Ich will, dass der Text mit float:right um das Bild herum läuft. Im FF kein Problem. Sieht genauso aus wies sein soll.

ABER wiedermal der IE…

code:

Ueberschrift

  • TEXT TEXT TEXT TEXT TEXT TEXT TEXTTEXT

  • TEXT TEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXT TEXT

  • TEXT TEXT TEXT TEXT TEXT TEXT TEXT

  • TEXT TEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXT TEXT

Preis: 000000 EUR

.main_inside {
width:370px;
padding:10px;
float:left;
}

.main_inside_2 {
border: 1px solid #000000;
}

.main_picture {
float:right;
border-left:1px solid #000000;
border-bottom:1px solid #000000;
margin-left:10px;
margin-bottom:10px;
}

.main_caption {
font-size:14px;
font-weight:bold;
padding-bottom:5px;
border-bottom:0px;
padding:5px;
height:30px;
}

.main_content {
padding:5px;
height:150px;
-display:inline; /* IE */
}

.main_price {
padding:5px;
overflow:hidden;
height:18px;
background-color:#ffffff;
}

li {
margin-left:-25px;
}

Ich kanns drehen und wenden wie ich will! So wie es gerade ist mit:
-display:inline; /* IE */

Kommts der Sache schon sehr sehr nahe. ABER die höhe der gesamten Box wird einfach ignoriert. Erst ab 450 Pixel wird sie wieder genommen (nur bei IE).

Ich hoffe da hat jmd nen Hack oder nen Workaround.

--------------------------------------------
| UEBERSCHRIFT | |
| - Text Text Text | |
| - Text Text Text | |
| - Text Text Text | |
| - Text Text Text | |
| - Text Text Text ---------------
| - Text Text TextText Text TextText Text |
| Text Text Text |
| |
---------------------------------------------

So solls aussehen. Eigentlich pillepalle! Ich raff nich warums der IE nich macht.

Und der CSS Code is richtig. Sagt der Validator und Firefox beweists ja. Der HTML Code is W3C konform. (Das oben is nur ein ausschnitt)

grüße vom digi

#2

Hallo alle zusammen …

habe da n Problem mitm IE6. Auf FireFox funktioniert es
blendend. Und is auch schon genauso wies aussehen soll. Nur
beim IE6 istn kleiner makel.

Und Zwar gehts darum:
Ich will, dass der Text mit float:right um das Bild herum
läuft. Im FF kein Problem. Sieht genauso aus wies sein soll.

ABER wiedermal der IE…

code:

Ueberschrift

  • TEXT TEXT

TEXT TEXT TEXT TEXT TEXTTEXT

  • TEXT TEXT TEXT

TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT
TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXT
TEXT

  • TEXT TEXT TEXT TEXT TEXT TEXT TEXT

  • TEXT

TEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXT
TEXTTEXT TEXT TEXT TEXT TEXT TEXT TEXT

Preis: 000000
EUR

Der Code mag vielleicht valide sein. Das bedeutet aber noch lange nicht, dass er auch sinnvoll ist. Sind derart viele DIV’s denn wirklich nötig? Ich denke nicht.

Hast Du vielleicht einen Link zu der entsprechenden Seite? Das wäre jedenfalls für mich einfacher um es nachzuvollziehen.

Gruß Marcus

#3

habe da n Problem mitm IE6. Auf FireFox funktioniert es
blendend. Und is auch schon genauso wies aussehen soll. Nur
beim IE6 istn kleiner makel.

Ich vermute, es hat was mit den ineinander verschachtelten floats zu tun. Da habe auch ich schon Probleme mit dem IE gehabt.

Dass der Code zwar valide ist, aber deswegen noch lange nicht sinnvoll oder semantisch korrekt, und dass dadurch die meisten Fehler entstehen, ist hier mit Sicherheit auch ein Aspekt, wo ich froh bin, dass ihn jemand anders vor mir genannt hat :smile:

Gruß,
-Efchen

P.S.: Ja, Tabellenlayouts sind heutzutage Quatsch. Aber Layouts mit divs sind genauso Humbug. CSS ist die Antwort.