nicht angemeldet
absolut zu relativ positionieren
Kai345Hallo!
Ich habe ein etwas verzwicktes Problem zu lösen. Und war möchte ein Kunde in seiner Website an bestimmten Stellen so kleine "Aufkleber" haben. Er meint damit Grafiken von Figuren die das Layout etwas auflockern sollen.
Meine Anweisungen sehen dann in etwa so aus: Die 1. Figur kommt links vom Login hin, die zweite unten rechts neben den Text und so weiter.
Mein Problem nun: Der Text und das Login sind zentriert. Stecke ich nun die Figur und den Text in eine Tabelle, dann ist der Text nicht mehr zentriert. Andere Möglichkeit wäre, per div-Bereich die Figur absolut zu positionieren. Wenn nun die Fenstergröße verändert wird oder jemand einfach eine andere Auflösung hat, dann ist die Ausnehmung des Textes plötzlich eine andere und die Figur wäre nicht mehr links neben dem Text.
Ich hoffe, ich konnte mein Problem halbwegs verständlich schildern. Ist gar nicht so einfach. Eine einfache und elegante Lösung dazu ist mir bisher noch nicht eingefallen. Vielleicht ist jemand unter Euch, der dieses Problem schon einmal erfolgreich gelöst hat. Über Tipps und Vorschläge würde ich mich freuen.
viele Grüße und danke schon mal im Voraus
Thomas.
Ps: Bitte um Verzeihung wenn es zu diesem Thema schon etwas im Archiv gibt. Ich hatte keine Ahnung, welche Suchbegriffe ich nehmen sollte um es zu finden.
-
Ahhh, was hab ich da bloß zusammengeschrieben? :-)
... und zwar möchte ein Kunde ...
Und natürlich ist die Ausdehnung des Textes gemeint und nicht die Ausnehmung ;-)
-
Grütze .. äh ... Grüße!
Mein Problem nun: Der Text und das Login sind zentriert. Stecke ich nun die Figur und den Text in eine Tabelle, dann ist der Text nicht mehr zentriert. Andere Möglichkeit wäre, per div-Bereich die Figur absolut zu positionieren. Wenn nun die Fenstergröße verändert wird oder jemand einfach eine andere Auflösung hat, dann ist die Ausnehmung des Textes plötzlich eine andere und die Figur wäre nicht mehr links neben dem Text.
Wenn das Elternelement relativ positioniert ist, dann kann innerhalb dieses Elementes absolut positioniert werden. Damit es nicht mit dem Text kollidiert, ein entsprechendes padding vorsehen.
Oder die Figur floaten
Cü
Kai--
What is the difference between Scientology and Microsoft? One is an
evil cult bent on world domination and the other was begun by L. Ron
Hubbard.
ie:{ fl:( br:< va:) ls:? fo:| rl:? n4:° ss:{ de:] js:| ch:? mo:| zu:|-
Hallo!
Vielen Dank schon einmal für Deine Antwort!
Meine Beschreibung war wohl doch nicht ganz so gut :-/
Das Bildchen ist leider ausserhalb der Tabelle und soll aber absolut zu dieser Tabelle positioniert werden. z.B. immer 50 Pixel neben der oberen Ecke der Tabelle, egal wie Breit die Tabelle aufgrund der gerade aktuellen Fenstergröße gerade ist.
Es ginge also darum, zwei Positionen durch eine Art Anker zu verknüfen. Ich wüßte aber nicht wie man das machen sollte.
viele Grüße
Thomas.
-
Grütze .. äh ... Grüße!
Meine Beschreibung war wohl doch nicht ganz so gut :-/
Das Bildchen ist leider ausserhalb der Tabelle und soll aber absolut zu dieser Tabelle positioniert werden. z.B. immer 50 Pixel neben der oberen Ecke der Tabelle, egal wie Breit die Tabelle aufgrund der gerade aktuellen Fenstergröße gerade ist.
Es ginge also darum, zwei Positionen durch eine Art Anker zu verknüfen. Ich wüßte aber nicht wie man das machen sollte.
Ich auch nicht. Wenn du das Bild immer absolut zu einem nicht bekannten, veränderlichen Eckpunkt eines Elements positionieren willst, muß das Bild schon innerhalb desselben sein. Ansonsten müßtest du *alles* auf der Seite absolut positionieren, aber dann ist es natürlich bei allen Auflösungen statisch und daher ohnehin nicht sehr sinnvoll. Eine Tabelle als Layout ist es übrigens auch nicht.
Cü
Kai--
What is the difference between Scientology and Microsoft? One is an
evil cult bent on world domination and the other was begun by L. Ron
Hubbard.
ie:{ fl:( br:< va:) ls:? fo:| rl:? n4:° ss:{ de:] js:| ch:? mo:| zu:| -
Hallo,
Wie Kai es schon gesagt hat, es braucht ein äußeres, allumfassendes Element (klingt irgendwie spirituell...).
Mithilfe des guten alten Texteditors ist das bestimmt ganz leicht (;
Wenns gar nicht klappt, gibt es auch noch die JS-Lib von Walter Zorn (erstes Bild verschieben, dann Fenster skalieren) und ich glaube, die YUI und Prototype können das auch.
Gruß, Nils
-
Das bekommst Du hin, wenn das Element, zu dessen Ecke das Bild relativ positioniert sein soll, zusammen mit der Figur in ein umgebendes Element steckst, z.B. ein div:
...
<div style="position:relative;padding:0">
<img style="position:absolute;top:-30px;left:-50px;" src="figur.png"/>
<table style="margin:0;">...Dat Ding mit dem Eck...</table>
</div>
...Wenn die Möglichkeit besteht, ist es aber besser, die Figur IN das Element mit dem Eck zu stecken (das spart Markup):
...
<div style="position:relative;">
...Dat Ding mit dem Eck...
<img style="position:absolute;top:-30px;left:-50px;" src="figur.png"/>
</div>
...nils-hero meinte schon im Prinzip dasselbe, ich dachte mir nur, ich mach es mal etwas ausführlicher.
Zur Erklärung: Die absolute Positionierung ist auch relativ. Aber im Gegensatz zu "relative" ist "absolute" nicht relativ zur ursprünglichen Darstellungsposition, sondern zum nächsthöheren Element, das eine andere Positionierung als der Standard "static" hat. Alles verstanden? :-D
-
-