Hallo zusammen.
Ich habe mir ein Layout mittels CSS gebastelt und brauche dringend Hilfe.

Da ich noch nicht so fit mit dieser neuen Technik bin, und in einem anderen Forum nur blöde Antworten und Kommentare auf meine Fragen bekommen habe, hoffe ich, dass es hier anders sein wird.

Es kann daher durchaus sein, dass der eine oder andere von Euch das ganze anders gemacht hätte ... Ich habe es jetzt mal so geschafft.

Also im FF sieht das Layout super aus ... (nocht ist aber kein Inhalt drinn)
Leider sieht das der IE etwas anders und will mir absolut nicht das darstellen was er soll.

Ich habe ein Bild angehängt, dass darstellt, wie IE das ganze sieht.

Der Große Kasten in der Mitte sollte natürlich auch in der Mitte oben sein.

Ich habe versucht das mit dem float Befehl zu machen, und trotz langem probieren schaffe ich es nicht, dass der DIV Tag für den Text auch in der Mitte bleibt.
Langsam gehen mir die Ideen aus.

Original Datei und Stylesheet findet Ihr unter: http://www.araneum.at/mm

Vielen Dank schon mal im Voraus ...

Angehängte Grafiken

ss_ie.jpg (60,9 KB, 282x aufgerufen)

__________________
LG aus Wien,
MaineCoon =^..^=
--------------------------
\"Du bist Zeitlebens für das verantwortlich,
was Du Dir vertraut gemacht hast.\"

Du bist ein Opfer des doubled float-margin bug des IE. (Dank wahsaga weiß ich inzwischen auch, dass dieses Kind einen Namen hat... )
War hier auch schon mal Thema...

Grüße
fricca

Hey, danke für die schnelle Antwort.

Kannst Du mir vielleicht auch verraten, wie man dem Problem auf die Spünge hilft?
Den Beitrag, den Du gelistet hast, bei dem gehen die Links nicht mehr - daher kann ich mir nicht wirklich was darunter vorstellen.

Wäre echt super. Ich poste Dir das CSS Sheet.
Vielen Dank

__________________
LG aus Wien,
MaineCoon =^..^=
--------------------------
\"Du bist Zeitlebens für das verantwortlich,
was Du Dir vertraut gemacht hast.\"

Der erste Link in meinem obigen Beitrag enthält einen Bugfix.
Nochmal:
http://www.positioniseverything.net/...ed-margin.html

Ich noch Mal.
Also ich hab das mit den farbigen Rändern ausprobiert ...

Hat an sich sofort funktioniert ! Super!
Damit es aber nicht fad wird, hat sich zum Glück ein anderes Problem aufgetan. Vielleicht weißt Du hier auch Rat?

Nun stellt mein Liebelingsbrowser zwar die Abstände zwischen den Div's richtig dar, dafür haut er mir unten was rein!

Ich pfeiff bald auf den sch... wenn ich daran denke, dass ich jahrelang nur für den optimiert hab, kommt mir das grausen.

Angehängte Grafiken

ss_ie_02.jpg (43,9 KB, 239x aufgerufen)

__________________
LG aus Wien,
MaineCoon =^..^=
--------------------------
\"Du bist Zeitlebens für das verantwortlich,
was Du Dir vertraut gemacht hast.\"

Wenn du mit "haut unten was rein" den Abstand des bottomnav meinen solltest, dann könnte vielleicht an margin-top:450px; liegen
Übrigens: nach den floatenden Elementen gehört ein clearendes..
D.h. in deinem Fall, dass du dem bottomnav ein clear:left verpassen musst (die Box imagebild soll ja weiterhin floaten, wenn ich dein Layout richtig verstehe?)

BTW: Was soll eigentlich diese Doppelangabe von Klassen und IDs? Noch dazu mit gleichem Namen?
IDs sind dazu da, um ein Element eindeutig im Dokument zu identifizieren und diesem im CSS nur für dieses Element gültige Eigenschaften zuzuweisen.
Klassen verwendet man, wenn man die gleichen Eigenschaften mehreren Elementen zuweisen möchte.
Eins von beiden reicht in deinem Fall.

Grüße
fricca

Danke für Deine Geduld ...

Also ich habe das mit dem cler:left gemacht und es war keine veränderung da. Was genau macht das?

Wenn ich die Höhe 450 wegmehme verliere ich im IE die letzte weiße Linie. Im FF ist das kein Problem. Außerdem hab ich dann unterhalb des IMAGE Div's eine weiße Linie, die so breit ist, wie die Bottomnav.

Da soll aber nur eine 10 px hohe, weiße Linie sein. Daher meine dumme Fragerei.

Bezüglich der Bezeichnungen: Ich dachte, dass jeder Div einen eindeutigen Namen braucht und daher hab ich ihn genauso genannt, wie der Stil den er bekommt. Was soll ich nun wegnehmen, den Namen?

Ich beginne zwar langsam einen gewissen Durchblick zu bekommen - aber von auskennen reden wir hier noch nicht.

__________________
LG aus Wien,
MaineCoon =^..^=
--------------------------
\"Du bist Zeitlebens für das verantwortlich,
was Du Dir vertraut gemacht hast.\"

Es schließt floatende Elemente ab. Außerdem heißt es clear.left; nicht cler.
Bei dir sorgt es dafür, dass das Element bottomnav wieder unter den Elementen liegt, die die float:left-Eigenschaft haben, dass es aber noch neben dem Element mit der float:right-Eigenschaft liegt.
Der IE reagiert übrigens nicht auf das clear...; der FF braucht es aber.

Die 450px sind keine Höhe, sondern ein oberer Randabstand. Deine "weißen Linien" kann ich nicht nachvollziehen. Woher kommen die? von der Border-Egenschaft? Von der Hintergrundgrafik? Weil ein Abstand bleibt und der Hintergrund durchschaut?

Es gibt keine "Namen", es gibt nur IDs und Klassen; da du in deinem CSS nur mit Klassen gearbeitet hast, kannst du aus dem HTML die IDs rausnehmen. Oder du änderst dein Stylesheet auf IDs und löscht dann die Klassen weg. Oder du verwendest es eben so, wie's sinnvoll ist: siehe mein voriges Posting.
Deine Doppelung ist zwar nicht falsch - aber es bläst deinen Quellcode unnötig auf und schafft Verwirrung, wenn du doch mal beides (IDs und Klassen) verwendest.
Klassen-Selektoren
ID-Selektoren

Dann solltest du dich mal durch diverse Tutorials lesen, bevor du weiter im Trüben fischt.
http://de.selfhtml.org/
http://www.css4you.de/
uvm. (Suchfunktion)
Wichtig auch die bereits verlinkte CSS-Spezifikation.

Grüße
fricca

Hi!
Der Content Div hat einen weißen Hintergrund. und ist 800 px breit und 480px hoch.
Darin befinden sich die Subnav, infobox, text und imagebild. ganz unten ist dann noch die bottomnav.
Darunter soll noch ein 10 px hoher weißer "rand" zu sehen sein. nämlich der rest vom Content div.

Werde mir mal die tuts durchlesen.

Leider weiß ich immer noch nicht, warum mir IE mein Layout so kaputt macht.


Nachdem ich alles gemacht habe mit Clear und top margin 450 weg schaut das ding im IE jetzt so aus!

Vielleicht kannst Du mir da noch einen Tip geben.
Vielen Dank !!

Angehängte Grafiken

ss_ie_03.jpg (70,7 KB, 196x aufgerufen)

__________________
LG aus Wien,
MaineCoon =^..^=
--------------------------
\"Du bist Zeitlebens für das verantwortlich,
was Du Dir vertraut gemacht hast.\"

Ich weiß nicht, welcher Bug dir da jetzt wieder dazwischenfunkt, aber setz doch das rechte Bild (#image) außerhalb der content-box (Breite dann 650px) und floate beide links.
#infobox,#text und #bottomnav bleiben innerhalb von #content.
#imr_copy bekommt ein clear:both.

BTW: Was soll eigentlich diese leere Tabelle in #image? Füge doch das Hintergrundbild direkt in das div #image ein...

Grüße
fricca

PS:
Die border-Eigenschaft schreibst du kürzer so:
border: 2px solid #003;
oder auch:
border-top:2px solid #003;
Dein Stylesheet wird dann übersichtlicher.
Und befrei es mal von überflüssigen border-Angaben, nur eine Farbangabe oder nur Rahmenart bewirkt gar nichts, wenn nicht auch eine Stärke dabeisteht...