Preserved Topic: find the center $Pages that link to <a href="https://ozoneasylum.com/backlink?for=18233" title="Pages that link to Preserved Topic: find the center" rel="nofollow" >Preserved Topic: find the center\$

Author	Thread
Osaires Paranoid (IV) Inmate From: oslo, Norway Insane since: Aug 2001	posted 08-09-2001 20:38 i have a picture that i want to be on the center of the page, how do i do this without tabels?
mr.maX Maniac (V) Mad Scientist From: Belgrade, Serbia Insane since: Sep 2000	posted 08-09-2001 20:46 You can do that with DHTML & JavaScript. Create absolutely positioned layer that will contain image and then write script that will reposition it to the center of page (you should also monitor window resizing). BTW Why don't you want to use tables? They will save you a lot of time in this case...
Osaires Paranoid (IV) Inmate From: oslo, Norway Insane since: Aug 2001	posted 08-09-2001 21:05 in this case it want work, it's a litel hard to explain, but how do you code the center script?
u-neek Bipolar (III) Inmate From: Berlin, Germany Insane since: Jan 2001	posted 08-09-2001 21:16 <div style="font: 11px #000 arial; width: 100%; height: 100%; text-align: center;">blabla</div> that's for horizontal alignment. i don't know vertical too... edit: something like margin-top: 50% or so.... [This message has been edited by u-neek (edited 08-09-2001).]
mobrul Bipolar (III) Inmate From: Insane since: Aug 2000	posted 08-10-2001 16:05 'align' for horizontal alignment 'valign' for vertical alignment That being said, I'm not sure that is what Osaires had in mind. Those above attributes only align the stuff that is within the container, RELATIVE TO THE CONTAINER. I think that Osaires wants the container centered RELATIVE TO THE WINDOW. That 'height=100%' won't help you in Netscape (at least pre 6...not sure about 6) In pre 6 NS, if height is set greater than the requirements of the container, container closes up around content. The one workaround I know for that would be to set the clipping rectangle...but in this case it doesn't seem that would work b/c you don't know the height of the window...which brings us back to Mr. Max's suggestion of monitoring window size. Please forgive me, as my strongest knowledge is IE, not NS. NS (pre 6): window.innerHeight = the height of the content area of the browser window...exclusive of all 'chrome' window.innerWidth = the width of the content area of the browser window...exclusive of all 'chrome' IE give your body an id (ex. <body id='george'> ) document.getElementById('george').clientHeight = height of the body document.getElementById('george').clientWidth = width of body Now you can use these numbers (recalculate onresize) and the size of your image. A little JavaScript for the math and you can figure out where center is. Offset by the appropriate amount (according to the size of your picture) and set image left and top accordingly. Voila! A centered image. Get it? mobrul
Slime Lunatic (VI) Mad Scientist From: Massachusetts, USA Insane since: Mar 2000	posted 08-10-2001 16:15 document.body.clientWidth is a simpler way to do it in IE than giving the body an ID.
Osaires Paranoid (IV) Inmate From: oslo, Norway Insane since: Aug 2001	posted 08-10-2001 19:57 well now i got the screen size height and width right? and then i need to get the value in a variabel
Slime Lunatic (VI) Mad Scientist From: Massachusetts, USA Insane since: Mar 2000	posted 08-10-2001 21:48 Putting a value into a variable is always a simple matter of saying var myvariable = value; ("var" is optional.) in this case... var bigWidth = document.body.clientWidth;
twItch^ Maniac (V) Mad Scientist From: the west wing Insane since: Aug 2000	posted 08-10-2001 22:02 you can set it in the body background using css... code: body { background : url(image.jpg) center no-repeat; } s t e p h e n
Osaires Paranoid (IV) Inmate From: oslo, Norway Insane since: Aug 2001	posted 08-11-2001 02:02 Thanks. it works sorry for my sily question, i shold have figer this one out one my own.
Dark Neurotic (0) Inmate Newly admitted	posted 08-11-2001 04:28 Osaires your question wasn't silly, that's what we are here for However your last post is silly. (Mispelled words) "I am about to -- or I am going to -- die: either expression is correct." ~~ Dominique Bouhours, French grammarian, d. 1702

Preserved Topic: find the center\$

Author

Thread

Osaires
Paranoid (IV) Inmate

From: oslo, Norway
Insane since: Aug 2001

posted 08-09-2001 20:38

i have a picture that i want to be on the center of the page, how do i do this without tabels?

mr.maX
Maniac (V) Mad Scientist

From: Belgrade, Serbia
Insane since: Sep 2000

posted 08-09-2001 20:46

You can do that with DHTML & JavaScript. Create absolutely positioned layer that will contain image and then write script that will reposition it to the center of page (you should also monitor window resizing).

BTW Why don't you want to use tables? They will save you a lot of time in this case...

Osaires
Paranoid (IV) Inmate

From: oslo, Norway
Insane since: Aug 2001

posted 08-09-2001 21:05

in this case it want work, it's a litel hard to explain, but how do you code the center script?

u-neek
Bipolar (III) Inmate

From: Berlin, Germany
Insane since: Jan 2001

posted 08-09-2001 21:16

<div style="font: 11px #000 arial; width: 100%; height: 100%; text-align: center;">blabla</div>

that's for horizontal alignment.
i don't know vertical too...

edit: something like margin-top: 50% or so....

[This message has been edited by u-neek (edited 08-09-2001).]

mobrul
Bipolar (III) Inmate

From:
Insane since: Aug 2000

posted 08-10-2001 16:05

'align' for horizontal alignment
'valign' for vertical alignment
That being said, I'm not sure that is what Osaires had in mind. Those above attributes only align the stuff that is within the container, RELATIVE TO THE CONTAINER.
I think that Osaires wants the container centered RELATIVE TO THE WINDOW.
That 'height=100%' won't help you in Netscape (at least pre 6...not sure about 6)
In pre 6 NS, if height is set greater than the requirements of the container, container closes up around content. The one workaround I know for that would be to set the clipping rectangle...but in this case it doesn't seem that would work b/c you don't know the height of the window...which brings us back to Mr. Max's suggestion of monitoring window size.
Please forgive me, as my strongest knowledge is IE, not NS.

NS (pre 6):
window.innerHeight = the height of the content area of the browser window...exclusive of all 'chrome'
window.innerWidth = the width of the content area of the browser window...exclusive of all 'chrome'

IE
give your body an id (ex. <body id='george'> )
document.getElementById('george').clientHeight = height of the body
document.getElementById('george').clientWidth = width of body

Now you can use these numbers (recalculate onresize) and the size of your image. A little JavaScript for the math and you can figure out where center is. Offset by the appropriate amount (according to the size of your picture) and set image left and top accordingly.
Voila! A centered image.
Get it?

mobrul

Slime
Lunatic (VI) Mad Scientist

From: Massachusetts, USA
Insane since: Mar 2000

posted 08-10-2001 16:15

document.body.clientWidth is a simpler way to do it in IE than giving the body an ID.

Osaires
Paranoid (IV) Inmate

From: oslo, Norway
Insane since: Aug 2001

posted 08-10-2001 19:57

well now i got the screen size height and width right?

and then i need to get the value in a variabel

Slime
Lunatic (VI) Mad Scientist

From: Massachusetts, USA
Insane since: Mar 2000

posted 08-10-2001 21:48

Putting a value into a variable is always a simple matter of saying

var myvariable = value;

("var" is optional.) in this case...

var bigWidth = document.body.clientWidth;

twItch^
Maniac (V) Mad Scientist

From: the west wing
Insane since: Aug 2000

posted 08-10-2001 22:02

you can set it in the body background using css...

code:

body {

  background : url(image.jpg) center no-repeat;

}

s t e p h e n

Osaires
Paranoid (IV) Inmate

From: oslo, Norway
Insane since: Aug 2001

posted 08-11-2001 02:02

Thanks. it works

sorry for my sily question, i shold have figer this one out one my own.

Dark
Neurotic (0) Inmate
Newly admitted

posted 08-11-2001 04:28

Osaires your question wasn't silly, that's what we are here for
However your last post is silly. (Mispelled words)

"I am about to -- or I am going to -- die: either expression is correct."
~~ Dominique Bouhours, French grammarian, d. 1702