Topic: Vertical Centering (Page 1 of 1) Pages that link to <a href="https://ozoneasylum.com/backlink?for=30136" title="Pages that link to Topic: Vertical Centering (Page 1 of 1)" rel="nofollow" >Topic: Vertical Centering <span class="small">(Page 1 of 1)</span>\

 
Schitzoboy
Maniac (V) Inmate

From: Yes
Insane since: Feb 2001

posted posted 03-21-2008 05:50

I've tried a few various vertical centering methods. Most have problems in various browsers. What method do you guys use to vertical center a page, or an element? Here is a link to some good verical centering info that I've been working through.



(Edited by Schitzoboy on 03-21-2008 05:52)

zavaboy
Paranoid (IV) Inmate

From: f(x)
Insane since: Jun 2004

posted posted 03-21-2008 16:02

There is no way (to my knowledge) to get exact liquid centering without the use tables. Here's a page that can be used as an example of the method I used.

poi
Paranoid (IV) Inmate

From: Norway
Insane since: Jun 2002

posted posted 03-21-2008 16:13

Like on the page linked by zavaboy, I usually resort to the negative margin trick.

HZR
Paranoid (IV) Inmate

From: Cold Sweden
Insane since: Jul 2002

posted posted 03-21-2008 18:31
quote:

zavaboy said:

There is no way (to my knowledge) to get exact liquid centering without the use tables.


There is. It works in Opera, Gecko-based browsers and WebKit/KHTML browsers. It doesn't work in IE6, and probably not IE7. I'm unsure about IE8. But one can hack around IE's lack of support.

code:
<!doctype html>
<style>
div {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  border: 1px solid black;
  width: 100px;
  height: 100px;
}
</style>
<div>hey</div>


Demo.

(Edited by HZR on 03-21-2008 18:33)

zavaboy
Paranoid (IV) Inmate

From: f(x)
Insane since: Jun 2004

posted posted 03-22-2008 00:07

I meant with standard, cross-browser CSS... but I guess if I didn't type it, I didn't type it. Anyway, thanks HZR, for sharing.

HZR
Paranoid (IV) Inmate

From: Cold Sweden
Insane since: Jul 2002

posted posted 03-22-2008 08:27
quote:

zavaboy said:

I meant with standard, cross-browser CSS.


It's certainly standard. Only partly cross-browser though.

reisio
Paranoid (IV) Inmate

From: Florida
Insane since: Mar 2005

posted posted 03-23-2008 21:34

Yes, there are methods that work up to (down to?) IE6, but they get progressively lamer, so it's best to state exactly what sort of vertical centering you need so you can choose the least lame one (or so someone can inform you of the least lame one they know of).

tgkprog
Nervous Wreck (II) Inmate

From: Bangalore
Insane since: Apr 2008

posted posted 04-04-2008 19:11

ty was looking for this too!

~* http://sel2in.com/ *~ Have you clicked today http://www.thehungersite.com/ ? Have you played today http://freerice.com/ ?



Post Reply
 
Your User Name:
Your Password:
Login Options:
 
Your Text:
Loading...
Options:


« BackwardsOnwards »

Show Forum Drop Down Menu