XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   'DIV Kontainer automatisch zentrieren?' (http://xhtmlforum.de/showthread.php?t=31936)

Anonymous 02.06.2003 13:12

DIV Kontainer automatisch zentrieren?
 
Hi,

und zwar möchte ich auf einer Seite ein Zusammenstellung von einzelnen Grafiken und Text mit DIV's anordnen, das hat soweit geklappt. Nun ergibt sich aber das Problem das die DIV's fest in der Seite verankert sind und beim verändern der Fenstergröße unverändert bleiben, gibt es eventuell eine Möglichkeit, den Standort der DIV's an die Fenstergröße anzupassen?

Ich habe die DIV's nach folgendem Schema erstellt:

Thomas (css 4 you) 02.06.2003 18:48

Hi Tino,
du kannst für die Positionen left und top auch prozentuale Werte angeben.
Die passen sich an die Fenstergröße an. Reicht dir das?


Gruß
Thomas

Anonymous 03.06.2003 10:24

Hi,

naja so richtig nicht, es ist so ich habe ein Bild welches in einem div platziert ist, darüber liegen weiter 5 bilder in der gleichen ebene und sind halt im kreis angeordnet, auch mit divs, dann sind noch 5 weitere divs mit text so platziert, das sie halt neben den 5 bildern stehen. jetzt ist es halt nur so das die divs abolut platziert sind, so das beim verändern der fenster-/framegröße der noch vorhande raum genutzt wird und die bilder teilweise verschwinden.

Kann man die divs nicht absolut zu einem td-tag platzieren, halt relativ dazu? Weil dann könnte ich die divs in ein td schreiben und die tabelle passt sich der fenster-/framegröße an.

so long Tino

ulle 03.06.2003 10:37

Hallo,

vergiß die Tabelle !!!!!

Du kannst zum Beispiel die Bilder als Hintergrundbilder der einzelnen Container definieren. Diese Hintergrundbilder kannst Du wiederum im Container relative pos..

Beispiel.

Code:

background-position: 90% 95%;
background-repeat: no-repeat;

Wenn Du dieses geschickt anordnest, die 5 Container relativ zur Fensterbreite bzw. höhe, dann erreichst Du genau diesen effekt.

Im Prinzip kannst Du genau mein oben gezeigtes Beispiel übernehmen und das "relative Image" durch die 5 Container ersetzen.

Großer Vorteil der Hintergrundbilder ist das diese das layout nicht verschieben falls das Fenster mal kleiner ist.

Anonymous 03.06.2003 11:41

so weit so gut
 
aber,

das mit den prozentualen Abstand der Div's zum fenster-/framerand funktioniert im moment gant gut, doch leider im opera nur was die relative positionierung horizontal angeht, ein prozentualer für top wird nicht dynamisch verändert, im ie klappts :(

so long GG

ulle 03.06.2003 12:19

THINK ABOUT !!!

Wenn Du Dir mein Beispiel genau angesehen hast wirst Du entdeckt habe das ich in dem Selektor für html,body eine Höhe (100%) definiert habe.

Denn falls Du es nicht angegeben hast gibt es Probleme. Denn zb. height: 50% für einen Container von nix ist nix - ergo 50% von 100% ist 50%.

Habe mein Beispiel auch im Opera (7.01) getestet !!!! [OK]

Übrigens sollten margin und padding auf NULL stehen, da die Browser auch unterschiedliche Defaults haben und dann gibt es Probleme mit 100% Summe der einzelnen Container. (Tipp Boxmodel)

Außerdem mein Vorschlag mit den Hintergrundbildern doch für Dein Zweck ideal. Denn in die 5 Container kannst Du direkt die Texte zu den Bilder pos. und sparst so eine Ebene.

Anonymous 03.06.2003 12:59

Hi,

und zwar klappt es bei dem Opera 7.11 nur wenn du neu lädst, nachdem du die fenster-/seitengröße verändert hast, aber das passt schon, denn ich möchte hiermit nur unterschiedliche Bildschirmauflösungen abfangen.

soweit so gut :) vielen Dank!!!

Was anderes: wenn ich ein Liste hab und ein ideviduelles Listensymbol per ccs festlege, wie kann ich da den text vertikal zum bild zentrieren?
Habe es schon mit vertical-align: middle im li, ul und in einem span tag probiert, leider kein erfolg, weder im ie noch im opera :(

so long Tino

ulle 03.06.2003 14:02

Zitat:

Zitat von Tino
Was anderes: wenn ich ein Liste hab und ein ideviduelles Listensymbol per ccs festlege, wie kann ich da den text vertikal zum bild zentrieren?
Habe es schon mit vertical-align: middle im li, ul und in einem span tag probiert, leider kein erfolg, weder im ie noch im opera :(

Habe ich keine Erfahrungen!!!!

Thomas (css 4 you) 03.06.2003 19:26

Zitat:

Zitat von Tino
Hi,
Was anderes: wenn ich ein Liste hab und ein ideviduelles Listensymbol per ccs festlege, wie kann ich da den text vertikal zum bild zentrieren?
Habe es schon mit vertical-align: middle im li, ul und in einem span tag probiert, leider kein erfolg, weder im ie noch im opera :(

so long Tino

Ich realisiere das, indem ich die Grafik etwas höher mache und den unteren Teil transparent lasse. So wandert der sichtbare Teil nach oben.

Gruß
Thomas


Alle Zeitangaben in WEZ +2. Es ist jetzt 13:19 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2023