✔ DIV Container setzen

xxTejaxx

xxTejaxx

Mitglied
Hallo,

ich habe ein paar probleme mit meinen Containern.
In jedem Browser wird es anderst angezeigt und das finde ich nicht gerate hitverdächtig.
Also meine Frage: wie kann ich die Container anlegen, so dass alle Browser sie möglichst gleich interpretieren.

Hier mal eine Skizze des Aufbaus:
http://s7b.directupload.net/file/d/2073/wfpcxokd_png.htm

nun zum Quelltext der Container:

test.html
HTML: 
...
<div style="position:absolute;top:5px;left:5px;width:170px;height:210px;">
    Container1
</div>
<div style="position:absolute;top:220px;left:5px;width:170px;height:40px;">
    Container2
</div>
<div style="position:absolute;top:5px;left:180px;width:180px;height:260px;">
    Container3
</div>
<div style="position:absolute;top:270px;left:5px;width:360px;height:4px0;">
    Container4
</div>
<div style="position:absolute;top:320px;left:5px;width:170px;height:210px;">
    Container5
</div>
<div style="position:absolute;top:320px;left:180px;width:170px;height:210px;">
    Container6
</div>
<div style="position:absolute;top:540px;left:5px;width:360px;height:40px;">
    Container7
</div>
<div style="position:absolute;top:590px;left:5px;width:360px;height:40px;">
    Container8
</div>

So, habe also immer zum Absolutpunkt oben links bemessen, so interpretiert der Firefox das einigermaßen richtig jedoch haben IE und Opera damit probleme.
Für beiden letztgenannten Browser habe ich wie es im css steht immer versucht den Bezugspunkt auf den vorherigen Container zu wählen, aber das hat nur mässig geklappt und dann hat Firefox endloses durcheinander angezeigt.
Bin mit meinem schwachen CSS Latein am Ende.
Bitte um HIlfe.

Danke
 
Zuletzt bearbeitet:
Hi,

nicht gerade hitverdächtig sind deine fehlenden Angaben zur Maßeinheit (px), sowie das hight, das korrekt height lautet.

mfg Maik
 
Hallo

Ich hatte dieses Problem auch oft und bin nie dahinter gestiegen.

Ich würde dir Raten die Container mit Margin also ausenabstand zu Positionieren.
Die abweichungen sind dann nur noch minimal.

Also:

<div style="margin-top: 5px; margin-left: 5px; width: 170;hight: 210;">
Container1
</div>
 
Bei mir interpretieren alle Browser deine CSS-Positionierungen gleichermaßen falsch :-)

container-salat.jpg

Von daher solltest du mal deine einzelnen Angaben rechnerisch auf ihre Stimmigkeit überprüfen.

Falls du den Blöcken noch eine border-Eigenschaft gönnst, bedenke, dass sie sich dann gemäß dem Box-Modell vergrößern, weil diese Eigenschaft zu width und height hinzuaddiert wird.

mfg Maik
 
mhm, ok, ich scheine im Orginalquelltext irgendwo einen Tippfehler zu haben.
Im Orginal wird Container 6 immer richtig von Links eingerückt, jedoch in der Höhe liegt er unterhalb des Endes vonContainer 5.
da aber der obrige Quelltext die Container an die richtigen Stellen packt denke ich sollte sich mein Problem mit Hilfe von Suchen klären.

Danke euch :)

p.s: ja die rechnerisch passende Containergröße passe ich nochmal an :)
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück