|
 |
  |
| Autor |
Nachricht |
sunbringer
Helfer [Mod]
Anmeldung: 19.09.04
Beiträge: 222
|
 Verfasst am: 12.10.2004, 21:41 Titel: layer-Höhe automatisch auf bildschirmhöhe setzen |
 |
|
So nu muss ich auchmal was fragen 
habt ihr es schon geschafft per CSS einen Block (z.B. einen layer) genau mittig in der seite zu platzieren?
Nehmen wir mal ich möchte eine Grafik vom 100x100 px genu mittig im Browserfenster darstellen aber keine Auflösungsabfrage per javascripts etc machen. Von der Breite her ists keine problem, das erledigt margin: 0 auto; ganz gut, aber die höhe lässt mich verzeifeln grade...
Ich hatte gedacht ich köntne es mit einem Rahmen machen der Breite und Höhe 100% hat. mit der Breite funzt das auch, aber die Höhe mit 100% setzt nur die Höhe auf die Höhe der Grafik, also 100px... 
hilfe... seh ich rgade den Wald vor lauter Bäumen nicht oder geht das tatsächlich nicht?
_________________
Sind wir Helden oder Roggenbrötchen?
 Microcosm Media | Detektiv | Umwelt Atlas
|
|
| Nach oben |
|
 |
sunbringer
Helfer [Mod]
Anmeldung: 19.09.04
Beiträge: 222
|
| Verfasst am: 12.10.2004, 22:10 Titel: |
|
|
OK, ganz so doof bin ich doch nicht... 
Im Grunde ganz logisch der Ablauf... Falls es mal jemand braucht, schreib ich es mal hier auf:
Man deklariert eine Rahmen-Ebene mit den entsprechenden Maßen (im obigen Beispiel 100 x 100 px) nun setzt man top und left auf 50%. Damit ist die linke obere Ecke genau in der Mitte des Bildschirms platziert. Um den Rahmen nun abschließend in die richtige position zu kriegen nutzen wir noch margin und "ziehen" die Ebene genau um die Hälfte Ihrer Maße nach oben und nach Links zurück.... Tata: mittig!
der Code sieht dann so aus:
| Code: |
position:absolute;
top: 50%;
left: 50%;
height: 100px;
width: 100px;
margin: -50px 0 0 -50px;
|
*schwitz* feine Sache das CSS nur recht kompliziert manchmal
_________________
Sind wir Helden oder Roggenbrötchen?
Microcosm Media | Detektiv | Umwelt Atlas
|
|
| Nach oben |
|
|
JörgK
Beliebter [Mod]
Anmeldung: 09.04.04
Beiträge: 376
|
|
| Nach oben |
|
|
|
|
  |
|
Alle Zeiten sind GMT + 1 Stunde
|
| Seite 1 von 1 |
|  |
