Problem bei Positionierung von div-elementen

[RedDrag]

Hallo mal wieder,

Also ich hab als erstes links ein div- element hingemacht für die Navi und will jetzt rechts daneben noch eines haben, aber irgendwie klappt das jetzt mit der Positionierung vom zweiten nicht so ganz (das zweite Element ist immer irgendwo unten).
Weiß jemand eine Lösung?

 

[threadi]

Was du suchst heißt float: SELFHTML: Stylesheets / CSS-Eigenschaften / Positionierung und Anzeige von Elementen

 

[RedDrag]

demnach müsste ich ja bei der Navi float: left; hinschreiben, aber das macht auch kein Unterschied.

 

[dasch]

<div style='float: left; width: 40%;'>ebene1</div>
<div style='float:left;'>ebene 2</div>

 

[threadi]

Bei beiden Boxen. Und deren Breiten auch angeben.

 

[RedDrag]

macht keinerlei Unterscheid bei mir, aber ich kann ja mal den Code posten:

.div1 {float:left; width:170px; height:350px; margin:50px 85px; font-family: Helvetica; text-align:center; background-color:#000000; padding-top:1em; border: 8px solid #ADADAD;}
.div2 {float:left; width:250px; height:400px; margin:85px 350px; background-color:#000000;}

 

[ohrflieger]

Wie breit (Pixel) ist dein Bildschirm? Mit diesen Positionierungen muss man aufpassen. Sind die Elemente nebeneinander mit allen Rändern usw. zusammen breiter als die horizontale Bildschirmbreite, setzt der Browser das zweite Element automatisch unter das erste.

 

[RedDrag]

Also ich hab 1024 x 768 also, wenn ich es jetzt richtig verstanden habe sind die nicht breiter.

 

[threadi]

Doch, sind sie, weil zu

170 + 250 = 420

noch die Außenabstände links und rechts dazukommen:

2*85 + 2*350 = 870

Die Summe sollte klar sein dann ;-) Nimm die Außenabstände weg.

 

[RedDrag]

Also ich bin zwar der Meinung, dass deine Rechnung nicht ganz richtig ist, aber das ist jetzt auch egeal.

Ich hab es jetzt nochmal so probiert:
bei . div1 margin: 50px 0px 0px 85px
und bei .div2 margin: 0px 0px 0px 85px

demnach: 160+ 250+ 16+ 85+ 85= 606 (<768 )

aber div2 steht trotzdem nicht neben div1 sondern nur mit einem kleinen Teil.

 

[threadi]

Mit einem kleinen Teil? Hört sich an als hättest du noch einen Rahmen ringsherum der eine feste Breite vorgibt. Schon sehr verwirrend so ohne Quellcode ...

 

[RedDrag]

Den Quellcode habe ich ja gesendet.
Ich habe sonst nur noch ein Image ganz oben an der Seite, aber ich hab es schonmal ohne das probiert und es macht keinen großen Unterschied.
In dem einen div habe ich noch Links, aber die sollten ja nicht stören.

Hier noch ein Screenshot: http://i267.photobucket.com/albums/ii317/RedDrag/Unbenannt-1.jpg

 

[prm]

Wenn 85px Zwischenabstand sein sollen, dann so:

.div1 {float:left; width:170px; height:350px; margin:50px 0 0 85px; font-family: Helvetica; text-align:center; background-color:#000000; padding-top:1em; border: 8px solid #ADADAD;}
.div2 {width:250px; height:400px; margin:50px 0 0 356px; background-color:#000000;padding-top:1em;}

Der Linksabstand der zweiten Box entspricht Breite der ersten + Rahmen + Linksabstand der ersten + Abstand zwischen erster und zweiter Box.


Oder falls später noch ein .div3 daneben soll:

.div1 {float:left; width:170px; height:350px; margin:50px 0 0 85px; font-family: Helvetica; text-align:center; background-color:#000000; padding-top:1em; border: 8px solid #ADADAD;}
.div2 {float: left; width:250px; height:400px; margin:50px 0 0 85px; background-color:#000000;padding-top:1em;}

 

[RedDrag]

Den Zwischenabstand zwischen den beiden Boxen bekomme ich ja auch hin, aber div2 geht einfach nicht höher als auf dem Bild:sad:.

 

[prm]

Dann stimmt vermutlich noch etwas anderes nicht.
Es wäre sinnvoll, wenn du die Seite online stellst und einen Link angibst, damit man das Problem im Zusammenhang beurteilen kann.
Bilder sind dazu ungeeignet.

 

[RedDrag]

Ich hab jetzt ehrlich gesagt keine Zeit und keine Lust mich jetzt auch noch darum zu kümmern, wie das mit hochladen etc. geht:|.

Ihr habt zwei div elemente doch bestimmt auch schonmal nebeneinander gemacht. Könnt ihr mir dann nicht mal eine Quellcode geben, der bei euch funktioniert?

 

[thuemmy]

Na, wenn Du keine Zeit und keine Lust hast, was hoch zu laden, dann denke ich mir, dass ettliche User hier im Forum, die sonst immer gerne helfen, plötzlich keine Lust und Zeit mehr haben, zu helfen. Zumindest in Deinem Fall.

Du willst ja was von den anderen, und nicht umgekehrt.

Verständnissloser Gruß
thuemmy

 

[RedDrag]

Es macht einfach keinen Unterschied, ob ich euch hier den gesamten Quellcode (sogar noch mit Screenshot!) poste oder, ob ihr ihn euch ihm Internet anguckt! Ich will mich nicht jetzt noch 2Tage lang über das uploaden informieren-.- (das liegt nicht daran, dass ich kein Argament zeigen will!)
Wenn es dir Spaß bringt kannst du die anderen ja vom Antworten abhalten;-):neutral:.

Du willst ja was von den anderen, und nicht umgekehrt.

Genau und du willst ja helfen, und nicht andere vom Posten abhalten.

Ebenfalls verständnissloser Gruß
RD

 

[thuemmy]

Es macht einfach keinen Unterschied, ob ich euch hier den gesamten Quellcode (sogar noch mit Screenshot!) poste oder, ob ihr ihn euch ihm Internet anguckt!

Also oich habe hier leider nichst gefunden, wo Du den gesamten Quellcode gepostet hast, lediglich die 2 CSS-Definitionen von Deinen beiden divs. Und sorry, das Bild gibt ja auch keinen Quellcode her.

Aber ich sag mir immer, wer nicht will, der hat schon.

Wünsche Dir weiterhin noch fröhliches div-Verschieben
thuemmy

 

[prm]

RedDrag,

das siehst du falsch.
Ich versuche wirklich gerne zu helfen. Den von mir geposteten Code habe ich auch vorher - erfolgreich - im FF und IE getestet. Insofern muss er - isoliert betrachtet - auch funktionieren.
Wenn es also dennoch nicht funktioniert, dann muss es noch eine andere Fehlerursache geben, die man anhand der beiden Div's nicht erkennt.
Insofern ist dir definitiv nicht zu helfen, wenn man den Gesamtcode nicht sieht. Das ist keine Neugier von mir, sondern lediglich Hilfsbereitschaft.
Wenn du das anders siehst, dann ist es für mich auch o.k. und ich schließe mich den Ausführungen von thuemmy an.