Bilder / Buttons positionieren

01/15/2013 20:38 .Stefan#1
Hey Leute,

ich versuche momentan Bilder bzw Buttons an eine bestimmte stelle zu positionieren . Als momentane "Lösung" habe ich :

PHP Code:
<style>
#button-obl {
position:absolute;
margin-top:10px;
margin-left:25px;
} 
<button id="button-obl">...[/CODE]

Der passt im Grunde schon, jedoch verändert sich die Position nicht beim verändern der Fenstergröße von z.B Firefox. Somit passt das mit anderen Objekten wieder nicht. Die frage ist nun, wie ich die Position beibehalte und trotzdem noch einen guten Aufbau beibehalten kann bzw es auch bei einer veränderten Fenstergröße im Browser angepasst aussieht.

Mfg,

.Stefan
01/15/2013 21:15 MrPuschel#2
position:absolute; orientiert sich immer am nächsten relativ oder absolut positionierten Elternelement. ist das nicht vorhanden, orientiert es sich am document root. Das ist dein <body>. Du musst deinem Container Element noch ein position:relativ; verpassen. Damit der Browser weis, wo er sich auszurichten hat. Ausserdem solltest du bei position:absolute mit top und left arbeiten, nicht mit margin.

[Only registered and activated users can see links. Click Here To Register...]
[Only registered and activated users can see links. Click Here To Register...]
Margin ist der Abstand, nicht die Position des Elementes. Das kommt u.U. in älteren Browsern zu Fehldarstellungen.

Aber ohne den ganzen Code kann ich nur mutmaßen.
01/15/2013 22:59 .Stefan#3
danke erstmal für die Antwort, ich bin mir gerade nicht sicher ob da bei mir noch alles stimmt, aber wie würde es aussehen, wenn ich z.B ein Bild oder einen button auf die Position [400,400] setzen weill. :o ?

Mfg,
.Stefan
01/15/2013 23:16 MrPuschel#4
[Only registered and activated users can see links. Click Here To Register...]

Klick links oben auf "Run".
01/15/2013 23:42 .Stefan#5
Perfeeekt, damit kann ich was anfangen. Genau das habe ich gesucht ! Danke !

Mit freundlichen Grüßen,

.Stefan
01/15/2013 23:49 MrPuschel#6
Kein Problem ;)
01/16/2013 14:20 .Stefan#7
Ich hätte noch eine frage: Ich verstehe jetzt wie das mit den Bildern funktioniert, wie sieht das aber aus, wenn ich stattdessen eine inputbox setzen will ?
01/16/2013 16:41 MrPuschel#8
Mal ganz unter uns, du hättest ruhig mal versuchen können img gegen input auszutauschen ;)

[Only registered and activated users can see links. Click Here To Register...]

Bei mehreren Inputs solltest du classes verwenden. Wenn du ganz pro sein möchtest, verwende beim designen von Formularen nach wie vor Tabellen. Das bietet sich einfach an.
01/17/2013 00:34 .Stefan#9
Ja ist mir später auch aufgefallen und klappt jetzt alles super :)