<b>REGISTER</b>

GFX-Sector - HTML, CSS


 
GFX-Sector » Coding Area » Webentwicklung » HTML, CSS » [RESOLVED] Div vertikal zentrieren » Hello Guest [Login|Register]
Last Post | First Unread Post Print Page | Recommend to a Friend | Add Thread to Favorites

HTML, CSS

Einfache Scriptsprachen und deren Layout mit HTML und CSS
Post New Thread Post Reply

[RESOLVED] Div vertikal zentrieren

     Deutsche Version  English version
Author
Post « Previous Thread | Next Thread »

Kielo Kielo is a female
Weichzeichner


Kielo hat kein Avatar

Registration Date: 08.01.2010
Posts: 74

Guthaben: 0 Sector Coins
Aktienbestand: 0 Stück

Wohnort: Schweiz
Program: Photoshop, GIMP, Apophysis, UltraFractal
Deviantart: woronheart

Spacer
[RESOLVED] Div vertikal zentrieren

[RESOLVED] Div vertikal zentrieren

      

o.o Hoffe, ich war nicht einfach blind..

Ähm, ja. Ich möchte gerne ein Div nicht nur horizontal, sondern auch vertikal in der Mitte haben.
Jetzt habe ich das schon mehrere male auf x Arten versucht, drum frage ich mich langsam: ist das überhaupt möglich?
Wenn ja, wie?

lG

EDIT//
http://stylizedweb.com/2008/02/01/vertical-align-div/
Yays. Das funktioniert, wenn auch mit.. Hickhack.

This post has been edited 3 time(s), it was last edited by Kielo: 09.07.2010 14:58.

[RESOLVED] Div vertikal zentrieren 09.07.2010 09:57 Kielo is offline Homepage of Kielo Search for Posts by Kielo

Mr. Tool Mr. Tool is a male
Pfadfinder

Spender


Mr. Tool hat kein Avatar

Registration Date: 17.06.2007
Posts: 536

Guthaben: 0 Sector Coins
Aktienbestand: 0 Stück

Wohnort: Österreich
Program: Photoshop CS2
Deviantart: verel

Spacer
      

Also wenn es möglich wäre müsstest du dem Übergeordnetem Element eventuell ein vertical-align verpassen.

Das Problem an der Sache ist das dieses sogenannte vertica-align nicht auf Block lvl Elemente angewendet werden können sondern nur auf Inline Elementen wie z.B.: span

Die einzige möglichkeit die funktioniert ist mit margin-top (meines wissens)

Also entweder beim Seitenaufruf mit Javascript das Browser Inline Windows auslesen und damit das margin füttern oder einen definierten wert angeben.

EDIT://
Was ich noch nie probiert habe aber vielleicht funktionieren könnte wäre mit display:
also dem übergeordneten Div mit CSS ein "display:table-cell" zuweisen damit wird das block level element als td interpretiert und dann könnte das vertical-align auch ziehn. (nächstes Problem: wird erst ab IE8 unterstützt)



This post has been edited 2 time(s), it was last edited by Mr. Tool: 12.07.2010 23:12.

[RESOLVED] Div vertikal zentrieren 12.07.2010 23:08 Mr. Tool is offline Homepage of Mr. Tool Search for Posts by Mr. Tool

Kielo Kielo is a female
Weichzeichner


Kielo hat kein Avatar

Registration Date: 08.01.2010
Posts: 74

Guthaben: 0 Sector Coins
Aktienbestand: 0 Stück

Wohnort: Schweiz
Program: Photoshop, GIMP, Apophysis, UltraFractal
Deviantart: woronheart

Thread Starter Thread Started by Kielo
Spacer
      

Hey

Deine Lösung hab ich jetzt nicht versucht, danke aber dennoch.
Habe ja in's Edit geschrieben, dass es mit der beschriebenen Variante im Link funktioniert.
Ist zwar auch immer etwas Bastelei, scheint aber zu gehen.
Es geht einfach nur bei einer fixen Grösse, glaub ich, weil man das margin anpassen muss.
Und ob's in IE < 8 geht, weiss ich nicht.. Kann aber schon sein.

Kann's so genau jetzt aber auch nicht sagen.

[RESOLVED] Div vertikal zentrieren 13.07.2010 08:49 Kielo is offline Homepage of Kielo Search for Posts by Kielo

ClOuDy. ClOuDy. is a male
Polygonmeister


Avatar von ClOuDy.

Registration Date: 31.01.2010
Posts: 766

Guthaben: 150 Sector Coins
Aktienbestand: 0 Stück

Program: PS CS5

Spacer
      

geht auch unter ie8



[RESOLVED] Div vertikal zentrieren 13.07.2010 14:27 ClOuDy. is offline Search for Posts by ClOuDy.

Kielo Kielo is a female
Weichzeichner


Kielo hat kein Avatar

Registration Date: 08.01.2010
Posts: 74

Guthaben: 0 Sector Coins
Aktienbestand: 0 Stück

Wohnort: Schweiz
Program: Photoshop, GIMP, Apophysis, UltraFractal
Deviantart: woronheart

Thread Starter Thread Started by Kielo
Spacer
      

Joa, ich meinte IE < 8 (also Versionen unter IE cool . smile

[RESOLVED] Div vertikal zentrieren 14.07.2010 07:15 Kielo is offline Homepage of Kielo Search for Posts by Kielo

Balioo Balioo is a male
Scharfzeichner


Avatar von Balioo

Registration Date: 01.06.2009
Posts: 138

Guthaben: 0 Sector Coins
Aktienbestand: 0 Stück

Program: Adobe CS4 Master Collection
Deviantart: r93-design

Spacer
      

Da gibt es verschiedene Möglichkeiten.
U.a. die, die in dem Link beschrieben wird, wobei die aber nicht umbedingt die einfachste ist.
Es kommt halt drauf an, was und wo du es zentriert haben willst.

Mal angenommen, du haste einfach nur eine Grafik, die in die Bildmitte soll, dann könnest du das auch so machen:

code:
1:
2:
3:
4:
5:
6:
7:
#divname {
  position:fixed;   /* Absolute Position, Orientierung am Browserfenster, scrollt nicht mit */
  right:50%;        /* Hälfte von rechten Browserfensterrand */
  bottom:50%;    /* Hälfte von unteren Browserfensterrand */
}




OMG!

This post has been edited 1 time(s), it was last edited by Balioo: 14.07.2010 17:05.

[RESOLVED] Div vertikal zentrieren 14.07.2010 17:04 Balioo is offline Homepage of Balioo Search for Posts by Balioo

ClOuDy. ClOuDy. is a male
Polygonmeister


Avatar von ClOuDy.

Registration Date: 31.01.2010
Posts: 766

Guthaben: 150 Sector Coins
Aktienbestand: 0 Stück

Program: PS CS5

Spacer
      

quote:
Original von ClOuDy.
geht auch unter ie8


sag ich doch



[RESOLVED] Div vertikal zentrieren 14.07.2010 19:45 ClOuDy. is offline Search for Posts by ClOuDy.

Kielo Kielo is a female
Weichzeichner


Kielo hat kein Avatar

Registration Date: 08.01.2010
Posts: 74

Guthaben: 0 Sector Coins
Aktienbestand: 0 Stück

Wohnort: Schweiz
Program: Photoshop, GIMP, Apophysis, UltraFractal
Deviantart: woronheart

Thread Starter Thread Started by Kielo
Spacer
      

Ah, SO unter xD
Hab ich falsch verstanden.

@Balioo
o.O" Oh mann, ich hab ja dann schon mal wieder VIEL zu weit gesucht.

Danke großes Grinsen

[RESOLVED] Div vertikal zentrieren 19.07.2010 10:59 Kielo is offline Homepage of Kielo Search for Posts by Kielo
 
Spacer
   
GFX-Sector
unregistered


 hat kein Avatar


Spacer

Have you enjoyed this topic?


If you were enjoying this post and if you keen on reading more interesting stuff then do not hesitate to complete the free sign up.

After the free registration you will gain access to all areas and you will be able to communicate with other artists from all over the world.

In addition you will benefit from our Photoshop and coding section as well as from our huge (hundreds of gigabytes) free resource section where you can find everything you will need to be a successful (web) designer/artist.

Sign up now and enjoy the advantages as a registered member.

(This website will be ad-free after a complete free sign up.)

New Post 19.07.2010 10:59  
Tree Structure | Board Structure
Post New Thread Post Reply
GFX-Sector » Coding Area » Webentwicklung » HTML, CSS » [RESOLVED] Div vertikal zentrieren

Similar topics to [RESOLVED] Div vertikal zentrieren
Thread
divine afflatus joho joho (Forum: Artworks)
[Javascript] [Javascript] - Div Boxen ein ausblenden (Forum: Javascript Tutorials)
[S] Grafiker für diverse Aufgaben / Aufträge (Forum: Entgeltliche Grafikanfragen)
Divinus (Forum: Artworks)
Cloud seit neuestem Vertikal =O (Forum: Signaturen/Avatare)