DHTML and <center> !?!

[oldschwinn]

I'm hoping that someone can help me!

I've been playing around with DHTML, mainly adapting scripts that others have written for use on my Web site. However, I run into a snag with about 95% of the scripts I try to use.

The problem is this; my Web site centers itself using the <center> tag. As a result, using "position:absolute" never seems to draw stuff where it should. Switching to "position:relative" never seems to work at all?

I'm beginning to think that I cannot use <center> with DHTML. When I look at all the "example" sites, none of them seem to be centering site?

Does anyone have any insight into this?

Thanks,

Joey

[x_goose_x]

Post an example and we'll see what we can do.

[Roy Sinclair]

position: absolute and position: relative make boxes which are independant of the positioning of the normal HMTL elements they are surrounded by. Both require setting the exact position you want them, the difference is that relative items will position relative to the surrounding box element while absoulte items position relative to the body box element.

[oldschwinn]

Thanks for replying. Based on that, does that mean I'm screwed? since my Web site centers itself, how can I ever position stuff correctly?

I can email the page I'm working on if you are at all interested in helping?

Thanks!

Joey

[Roy Sinclair]

Originally posted by oldschwinn
Thanks for replying. Based on that, does that mean I'm screwed? since my Web site centers itself, how can I ever position stuff correctly?

I can email the page I'm working on if you are at all interested in helping?

Thanks!

Joey

The reason for using postion:absolute and position:relative is to allow exact positioning control and/or scripted positioning control of elements. If you want those elements inline, don't use the position: absolute or position:relative styles.

[oldschwinn]

Can I email you the page I'm working on so you can see exactly what i'm trying to do?

I really do appreciate the help by the way.

[brothercake]

With javascript you can center-position objects, by reading the screen width, something like this:




var ie=false;
if(typeof document.all!="undefined" && typeof window.opera == "undefined") { ie=true; }

var bWidth;
if(ie) { bWidth = document.body.clientWidth; }
else { bWidth = window.innerWidth; }

document.write('<div style="position:absolute\;left:'+((bWidth-100)/2)+'px\;top:100px"><img src="picture.gif" width="100" height="100" alt="" border="0"></div>');

[pinkotoad]

One popular workaround for centering with CSS is negative margins:

position:absolute;
left:50%;
width:500px;
height:900px;
margin-left:-250px;

It works, think about it a lil bit and you will figure out why. The best part about this is that it requires no javascript :thumbsup: