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 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 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 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 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 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 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 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 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/ ?

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 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 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 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 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 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 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 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 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:	Remember Me On This Computer

Your Text: Insert Slimies » Insert UBB Code » Close Last Tag \| All Tags UBB Help	Loading...
Options:	Show Signature Enable Slimies Enable Linkwords

Topic: Vertical Centering (Page 1 of 1)

Insert Slimies »

Insert UBB Code »

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>\$