is it posible to have relatively positioned layers?

[liunx]

Hi, <br />
I am using layers for some rollovers. However, as the page is centred, the layers fall out of alignment depending on the screen size. <br />
<br />
Is it possible to have relatively positioned layers that will change postion automatically? <br />
<br />
thanks<!--content-->Do you have the page online, or could you post the code (without any real content, as that's irrelevant)? Also, what do you mean by "layers"? The <LAYER> tag, or <DIV> tags?<!--content-->I am using div tags<br />
<br />
<div id="Layer3" style="position:relative; width:9px; height:6px; z-index:3; left: 678px; top: 104px;" onMouseOver="MM_showHideLayers('Layer4','','show')"><img src=http://www.webdeveloper.com/forum/archive/index.php/"contents/prevorig.jpg" width="51" height="34"></div><br />
<div id="Layer4" style="position:relative; width:45px; height:25px; z-index:4; left: 678px; top: 104px; visibility: hidden;" onClick="MM_goToURL('parent','web%20design/webdesigntemplate.htm');return document.MM_returnValue" onMouseOut="MM_showHideLayers('Layer3','','show','Layer4','','hide')"><img src=http://www.webdeveloper.com/forum/archive/index.php/"contents/prevrollover.jpg" width="51" height="34" style="cursorointer " alt="previous"></div><br />
<br />
heres the javascript that goes in the head tag<br />
<br />
<script language="JavaScript" type="text/JavaScript"><br />
<!--<br />
function MM_reloadPage(init) { //reloads the window if Nav4 resized<br />
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {<br />
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}<br />
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();<br />
}<br />
MM_reloadPage(true);<br />
<br />
function MM_preloadImages() { //v3.0<br />
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();<br />
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)<br />
if (a.indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=http://www.webdeveloper.com/forum/archive/index.php/a;}}<br />
}<br />
<br />
function MM_swapImgRestore() { //v3.0<br />
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a)&&x.oSrc;i++) x.src=http://www.webdeveloper.com/forum/archive/index.php/x.oSrc;<br />
}<br />
<br />
function MM_findObj(n, d) { //v4.01<br />
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {<br />
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}<br />
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[n];<br />
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers.document);<br />
if(!x && d.getElementById) x=d.getElementById(n); return x;<br />
}<br />
<br />
function MM_swapImage() { //v3.0<br />
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)<br />
if ((x=MM_findObj(a))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=http://www.webdeveloper.com/forum/archive/index.php/x.src; x.src=a[i+2];}<br />
}<br />
<br />
function MM_showHideLayers() { //v6.0<br />
var i,p,v,obj,args=MM_showHideLayers.arguments;<br />
for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args))!=null) { v=args[i+2];<br />
if (obj.style) { obj=obj.style; v=(v=='show')?'visible'v=='hide')?'hidden':v; }<br />
obj.visibility=v; }<br />
}<br />
<br />
function MM_goToURL() { //v3.0<br />
var i, args=MM_goToURL.arguments; document.MM_returnValue = false;<br />
for (i=0; i<(args.length-1); i+=2) eval(args+".location='"+args[i+1]+"'");<br />
}<br />
//--><br />
</script><br />
<br />
<br />
<br />
thanks<!--content-->Hm, what screen resolution does it break on? 800x600?<!--content-->If you reference position is center (as you said the page is centered) than try position layers at 50% and use the margin trick:<br />
<br />
position:absolute;<br />
left:50%;<br />
margin-left:valpx<br />
<br />
valpx may be negative or positive, according to your needs<br />
<br />
Now you layer will be positioned at valpx from center (on X axis) nomatter the resolution<!--content-->