This is Interesting: Free Magazines for Graphics designers and webmasters  


Home > Archive > Stylesheets > November 2004 > Centering a layer in the window with CSS





You are viewing an archived Text-only version of the thread. To view this thread in it's original format and/or if you want to reply to this thread please [click here]

Author Centering a layer in the window with CSS
Peter Altenberg

2004-11-22, 11:22 pm

is there some way to make the positioning of a layer (div) so that it
is centered in the window. so even when you resize the window it stays
centered? i would like to do this with CSS just like you can with
tables.

thanks,
~peter
Els

2004-11-22, 11:22 pm

Chris Leipold wrote:

> Hi,
>
>
> First, a layer is not a div. (There once was a
> layer-element, so don't mix them up).
>
> Centering a div should work like this:
> <div
> style="margin-left:auto;margin-right:auto;">[...]</div>


That doesn't work in IE5 for Windows.
http://locusmeus.com/html-css/centeringpage.html

--
Els
http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Chris Leipold

2004-11-22, 11:22 pm

Hi,

> That doesn't work in IE5 for Windows.
> http://locusmeus.com/html-css/centeringpage.html

omg. Kick IE5 for windows. Use Conditional Comments to kick IE5-users to
www.getfirefox.com
Chris Leipold

2004-11-22, 11:22 pm

Hi Els,

> Conditional Comments? As in: Opera being kicked too, just cause
> it identifies as IE? Nah, I prefer to make a simple adjustment
> to include those users :-)

Opera does not recognize CCs. You can therefore use them savely. And you
should read what they are and what they do.

Chris
Brian

2004-11-23, 4:23 am

Chris Leipold wrote:

> omg. Kick IE5 for windows. Use Conditional Comments to kick IE5-users
> to www.getfirefox.com


Telling users that they're using the wrong software is rather rude,
isn't it? Especially after they were kind enough to invite you into
their web "browser". Oh, and btw, some users -- e.g. those at work --
are stuck with MS software.

--
Brian (remove "invalid" to email me)
Cezar

2004-11-23, 7:25 pm

Peter Altenberg napisał(a):

> is there some way to make the positioning of a layer (div) so that it
> is centered in the window. so even when you resize the window it stays
> centered? i would like to do this with CSS just like you can with
> tables.


This may help You:
http://css-discuss.incutio.com/?pag...ingBlockElement

--
Regards,
Cezar
PDannyD

2004-11-23, 7:25 pm

On Fri, 19 Nov 2004 09:48:28 +0100, Chris Leipold <cleipold@dietzk.de>
wrote in message <305qaoF2t1f2tU2@uni-berlin.de>:

> Hi,
>
> omg. Kick IE5 for windows. Use Conditional Comments to kick IE5-users to
> www.getfirefox.com


:-)

Or something more polite like "You are using an out-dated browser. It is
recommended you download the latest patches and updates for a better
browsing experience and greater security and stability.
Alternatively, have you considered <insert-favourite-browser-name-here>?"

--
FZS600 - Silver/Black
GS125 - Black/Rust
Ford 100E Prefect - Black, naturally
Whisky - Aberlour Cask Strength
Christoph Paeper

2004-11-23, 7:25 pm

*Frances Del Rio* <fdr58@yahoo.com>:
> Peter Altenberg wrote:
>
>
> I know some people will yell and scream that this is not orthodox way to
> do it,


It is in fact a very "orthodox" way, the one from table layout days.

> but this is what I do when I need to center a div and it always works
> (IE and Netscape anyway..)


Strange definition of "always".

> it does involve tables, but it's the only sure way I have found to
> center divs, take it or leave it:


Then you didn't search well enough. Others have given the correct CSS
approach (the hack for IE5 with 'text-align' wasn't mentioned explicitely
AFAICS, but is described in almost all FAQ answers on this issue).

> <div id="stuff" style="position:absolute; top:80px; left:0px">
> <table border=1 cellpadding=0 cellspacing=0 width="100%">
> <tr><td align=center>


\me is away vomiting.

> if (navigator.userAgent.indexOf('Opera') != -1 ) {
> location = "version_of_pg_for_Opera.html"}


Ew, it comes again.

--
If the glass is half full or half empty
depends on if you are pouring or drinking.
Frances Del Rio

2004-11-23, 7:26 pm

Peter Altenberg wrote:

> is there some way to make the positioning of a layer (div) so that it
> is centered in the window. so even when you resize the window it stays
> centered? i would like to do this with CSS just like you can with
> tables.


I know some people will yell and scream that this is not orthodox way to
do it, but this is what I do when I need to center a div and it always
works (IE and Netscape anyway..) it does involve tables, but it's the
only sure way I have found to center divs, take it or leave it:

http://www.francesdelrio.com/index_center_div.html

this is what I do:

<div id="stuff" style="position:absolute; top:80px; left:0px">
<table border=1 cellpadding=0 cellspacing=0 width="100%">
<tr><td align=center>

content of div goes here...
(which can be another table with whatever width you want.. and it
will be centered..)

</td></tr></table>
</div>

I left table borders on so you better see what I did.. I'm afraid it
doesn't work in Opera b/c Opera does not respect table wdth of 100% (so
if I do want my pg to work in Opera I do a diff. version where div is
not strictly centered (or do it w/tables-only for Opera) and direct pg
to diff. version with a browser-detection script..

if (navigator.userAgent.indexOf('Opera') != -1 ) {
location = "version_of_pg_for_Opera.html"
}

good luck..... HTH... Frances





Sponsored Links


Copyright 2003 - 2008 forum4designers.com  Software forum  Computer Hardware reviews