View Full Version : Help with DIV Positioning


divinesword
01-30-2005, 08:14 PM
http://www.senshi-moon.net/tears/fan/in.html

For some reason, my third DIV layer is not where I wanted it to be. I changed the z-index and all, but for some reason, it's just not working...



<body background="http://www.senshi-moon.net/tears/fan/layout/bg.gif">
<body allowtransparency="true">
<title>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp what lies hidden &nbsp&nbsp&nbsp&nbsp official ao/sou fanlisting</title>

<SCRIPT LANGUAGE="JavaScript">
<!-- Idea by: Nic Wolfe (Nic@TimelapseProductions.com) -->
<!-- Web URL: http://fineline.xs.mw -->

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->

<!-- Begin
function popUp(URL) {
day = new Date();
id = day.getTime();
eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=1,location=0,statusbar=0,men ubar=0,resizable=0,width=30 0,height=300,left = 390,top = 262');");
}
// End -->
</script>




<script>

/*
Gradual-Highlight Image Script II-
By J. Mark Birenbaum (birenbau@ugrad.cs.ualberta.ca)
Permission granted to Dynamicdrive.com to feature script in archive
For full source to script, visit http://dynamicdrive.com
*/

nereidFadeObjects = new Object();
nereidFadeTimers = new Object();

/* object - image to be faded (actual object, not name);
* destop - destination transparency level (ie 80, for mostly solid)
* rate - time in milliseconds between trasparency changes (best under 100)
* delta - amount of change each time (ie 5, for 5% change in transparency)
*/

function nereidFade(object, destOp, rate, delta){
if (!document.all)
return
if (object != "[object]"){ //do this so I can take a string too
setTimeout("nereidFade("+object+","+destOp+","+rate+","+delta+")",0);
return;
}

clearTimeout(nereidFadeTimers[object.sourceIndex]);

diff = destOp-object.filters.alpha.opacity;
direction = 1;
if (object.filters.alpha.opacity > destOp){
direction = -1;
}
delta=Math.min(direction*diff,delta);
object.filters.alpha.opacity+=direction*delta;

if (object.filters.alpha.opacity != destOp){
nereidFadeObjects[object.sourceIndex]=object;
nereidFadeTimers[object.sourceIndex]=setTimeout("nereidFade(nereidFadeObjects ["+object.sourceIndex+"],"+destOp+","+rate+","+delta+")",rate);
}
}

</script>



<style type="text/css">
a:link,a:visited{color:mediumvioletred;font:7pt verdana; text-decoration:none}
a:active{color:mediumvioletred;font:7pt verdana; text-decoration:none;}
a:hover:{color:white; text-decoration:overline; cursor:crosshair;}
</style>

<style type="text/css">
td,p,body{color:palevioletred;font:7pt verdana}
</style>

<style type="text/css">
body{cursor:crosshair}
</style>

<div style="position:absolute; top:0; left:0; z-index:1;"><img src="http://www.senshi-moon.net/tears/fan/layout/layout.gif">
</div>
<div style="position:absolute; top:284; left:169; width:217; height:600; z-index:2;">
<p><b> ::Welcome :: </b><div align="justify"><p>
&nbsp&nbsp&nbsp Welcome to <i>What Lies Hidden</i>, a fanlisting for the relationship between Shinomori Aoshi and Seta Soujiro from the anime, Rurouni Kenshin. This fanlisting has been approved by <a href="http://www.thefanlistings.org">thefanlistings.org</a> and <a href="http://www.animefanlistings.org">animefanlistings.org</a>. This listing was started on September 10, 2004.
<p>
This site is a part of <a href="http://www.senshi-moon.net/tears">Tears of Blood</a> Hikage's random site for the anime characters she writes fanfiction with. And I am also hosted by <a href="http://www.senshi-moon.net">Ami</a>.
<p>
<b>Last Updated</b>: 01.10.05
<p>
<br>
<b>:: About ::</b>
<p>
&nbsp&nbsp&nbsp Alright. A fanlisting is a site that well...lists fans of a certain topic or person or subject. There are fanlistings to actors, anime, anything you can imagine. There are a few <a href="http://www.geocities.com/thetenswords/fanlists/rules.html">rules</a> to joining, but usually, most people get accepted.
<p>
As you must has suspected by now, this fanlisting is dedicated to the relationship between Shinomori Aoshi and Seta Soujiro from the anime, Rurouni Kenshin. This is, their relationship in any sort of way, but particularly, a romantic one.
<p>

Why would they be such a great couple, you ask? Well, think about it. Though they never really had much screen time together in the anime, they share a lot in common in different ways. Both hide their emotions, but in different ways: Aoshi hides them inside his heart, while Soujiro hides them behind a smile. Both had tragic things happen to them, and both are looking for peace.
<p>
And where else to find peace than within eachother, right?
<P>
Also, they have some differences that sort of help them fit together. Soujiro is a bit more childlike and curious than Aoshi, who is more mature and weathered, it seems. Soujiro's constant happiness blends in with Aoshi's rare smiles and calmer personality.
<p>
Not to mention, they're so cute together!
<p>
Viva la cuteness!
<p>
<b>:: Rules ::</b>
<p>
1. Of course. You must be a fan of Aoshi and Soujiro, in any sort of relationship.
<p>
2. List a real country and name when you apply, please. No names like Soujiro_fan_103 or whatever.
<p>
3. No flames, please. It's a waste of my time and yours.
<p>
4. If you have a website, please put up a code, and save it to your own server. If you don't I won't list you.
<p>
<b>:: Join ::</b>
<p>

<FORM METHOD="POST" ACTION="http://cgi21.Freedback.com/mail.pl" target="_blank">
<INPUT TYPE="hidden" NAME="to" VALUE="thetenswords@yahoo.co.uk">
<INPUT TYPE="hidden" name="subject" VALUE="Joining Fanlisting.">
<INPUT TYPE="hidden" NAME="form" VALUE="http://www.senshi-moon.net/tears">
<INPUT TYPE="hidden" NAME="admin" VALUE="thetenswords@yahoo.co.uk">
<INPUT TYPE="hidden" NAME="language" VALUE="en">
<p>
<input name="name" value="name" size=20 style="background-color:transparent; color: black;
font-face: verdana; font-size: 8pt; border: 1 black solid">
<br>
<input name="email" value="email" size=20 style="background-color:transparent; color:black;
font-face: verdana; font-size: 8pt; border: 1 black solid">
<br>
<input name="country" value="country" size=20 style="background-color:transparent; color: black;
font-face: verdana; font-size: 8pt; border: 1 black solid">
<br>

<input name="url" value="url" size=20 style="background-color:transparent; color: black;
font-face: verdana; font-size: 8pt; border: 1 black solid">
<br>
<input name="comment" value="comment" size=20 style="background-color:transparent; color: black;
font-face: verdana; font-size: 8pt; border: 1 black solid">
<br>

<br>
<INPUT TYPE="submit" NAME="Submit" value="Join" style="background-color:transparent; color: black;
font-face: tahoma; font-size: 8pt; border: 1 black solid">
</FORM>
<p>
<b>:: Codes ::</b>
<p>
&nbsp&nbsp&nbsp <b>Remember:</b> Save these to your own server!<p>

<img src="http://www.senshi-moon.net/tears/fan/fl1.jpg">&nbsp

<img src="http://www.senshi-moon.net/tears/fan/fl2.jpg">&nbsp

<img src="http://www.senshi-moon.net/tears/fan/fl3.jpg">&nbsp

<img src="http://www.senshi-moon.net/tears/fan/fl4.jpg">&nbsp

<img src="http://www.senshi-moon.net/tears/fan/fl5.jpg">&nbsp

<p>
Text linkage is fine. If you'd like to donate a code, <a href="mailto:thetenswords@yahoo.co.uk">contact</a> me. I'd appreciate any banners from others, and I'll credit you, too!
<p><br>
<b>:: Miscellany ::</b>
<p>

<A HREF="javascript:popUp('http://www.senshi-moon.net/tears/fan/gallery.html')"> Gallery</A>
<p>
<A HREF="javascript:popUp('http://www.senshi-moon.net/tears/fan/recs.html')">Fan fic Reccomendations</A>
<p>
<A HREF="javascript:popUp('http://www.senshi-moon.net/tears/fan/links.html')">Lin ks Out</A>
<p>
<A HREF="javascript:popUp('http://www.senshi-moon.net/tears/fan/credits.html')">C redits</A>
<p>
</DIV>

<div style="position:absolute; top:316; left:17; width:127; height:600; z-index:3;">
:: <b>Members</b> ::
<p>
1. Oniwabanshu ; USA ; <a href="http://www.angelfire.com/anime5/oniwabanshu0">www</a>
<br>
2. April-san ; USA ; <a href="http://www.geocities.com/aoshiandsou">www</a>
<br>
3. Nanako ; USA ; www
<br>
4. Miyako ; Canada ; www
<br>
5. Sayrah ; USA ; <a href="http://www.livejournal.com/userinfo.bml?user=shinomori_seta">www</a>
<br>
6. Talyn ; USA ; <a href="http://www.geocities.com/yaoibystander">www</a>
<br>
7. Buruma ; USA ; <a href="http://fanlists.buruma.net/soujiroseta">www</a>
<br>
8. Sylindara ; New Zealand ; www
</div>

MaGiCSuN
01-30-2005, 08:18 PM
first change your actual webpage layout to this:

<html>
<head>
<title>bla</title>
ALL CSS HERE
</head>
<body>
CONTENT HERE
</body>
</html>

so make sure you got the basic skelet from above. Then move your style codings (<style></style>) between the <head> and </head>. Then merge your two <body> tags together, so that you only have one <body> tag.

also add px behind your values :)
first that, then we'll see :)

Love,
Mirna

divinesword
01-30-2005, 08:48 PM
Ah, that didn't work...

pb&j
01-30-2005, 10:09 PM
coding cleaned up a bit...
now what is out of place??

<html>
<head>

<title>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp what lies hidden &nbsp&nbsp&nbsp&nbsp official ao/sou fanlisting</title>

<SCRIPT LANGUAGE="JavaScript">
<!-- Idea by: Nic Wolfe (Nic@TimelapseProductions.com) -->
<!-- Web URL: http://fineline.xs.mw -->
<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->
<!-- Begin
function popUp(URL) {
day = new Date();
id = day.getTime();
eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=1,location=0,statusbar=0,men ubar=0,resizable=0,width=300,height=300,left = 390,top = 262');");
}
// End -->
</script>

<script>
/*
Gradual-Highlight Image Script II-
By J. Mark Birenbaum (birenbau@ugrad.cs.ualberta.ca)
Permission granted to Dynamicdrive.com to feature script in archive
For full source to script, visit http://dynamicdrive.com
*/

nereidFadeObjects = new Object();
nereidFadeTimers = new Object();

/* object - image to be faded (actual object, not name);
* destop - destination transparency level (ie 80, for mostly solid)
* rate - time in milliseconds between trasparency changes (best under 100)
* delta - amount of change each time (ie 5, for 5% change in transparency)
*/

function nereidFade(object, destOp, rate, delta){
if (!document.all)
return
if (object != "[object]"){ //do this so I can take a string too
setTimeout("nereidFade("+object+","+destOp+","+rate+","+delta+")",0);
return;
}

clearTimeout(nereidFadeTimers[object.sourceIndex]);

diff = destOp-object.filters.alpha.opacity;
direction = 1;
if (object.filters.alpha.opacity > destOp){
direction = -1;
}
delta=Math.min(direction*diff,delta);
object.filters.alpha.opacity+=direction*delta;

if (object.filters.alpha.opacity != destOp){
nereidFadeObjects[object.sourceIndex]=object;
nereidFadeTimers[object.sourceIndex]=setTimeout("nereidFade(nereidFadeObjects["+object.sourceIndex+"],"+destOp+","+rate+","+delta+")",rate);
}
}
</script>

<style type="text/css">
a:link,a:visited {color:mediumvioletred; font:7pt verdana; text-decoration:none}
a:active {color:mediumvioletred; font:7pt verdana; text-decoration:none;}
a:hover {color:white; text-decoration:overline; cursor:crosshair;}
td,p,body {color:palevioletred; font:7pt verdana}
body{cursor:crosshair}
</style>

</head>

<body background="http://www.senshi-moon.net/tears/fan/layout/bg.gif">

<div style="position:absolute; top:0px; left:0px;">
<img src="http://www.senshi-moon.net/tears/fan/layout/layout.gif">
</div>

<div style="position:absolute; top:316px; left:17px; width:127px; height:600px;">
:: <b>Members</b> ::
<p>
<b>1</b>. Oniwabanshu ; USA ; <a href="http://www.angelfire.com/anime5/oniwabanshu0">www</a>
<br>
<b>2</b>. April-san ; USA ; <a href="http://www.geocities.com/aoshiandsou">www</a>
<br>
<b>3</b>. Nanako ; USA ; www
<br>
<b>4</b>. Miyako ; Canada ; www
<br>
<b>5</b>. Sayrah ; USA ; <a href="http://www.livejournal.com/userinfo.bml?user=shinomori_seta">www</a>
<br>
<b>6</b>. Talyn ; USA ; <a href="http://www.geocities.com/yaoibystander">www</a>
<br>
<b>7</b>. Buruma ; USA ; <a href="http://fanlists.buruma.net/soujiroseta">www</a>
<br>
<b>8</b>. Sylindara ; New Zealand ; www
</div>

<div style="position:absolute; top:284px; left:169px; width:217px; height:600px;">
<p><b> ::Welcome :: </b><p align="justify">
&nbsp&nbsp&nbsp Welcome to <i>What Lies Hidden</i>, a fanlisting for the relationship between Shinomori Aoshi and Seta Soujiro from the anime, Rurouni Kenshin. This fanlisting has been approved by <a href="http://www.thefanlistings.org">thefanlistings.org</a> and <a href="http://www.animefanlistings.org">animefanlistings.org</a>. This listing was started on September 10, 2004.
<p>
This site is a part of <a href="http://www.senshi-moon.net/tears">Tears of Blood</a> Hikage's random site for the anime characters she writes fanfiction with. And I am also hosted by <a href="http://www.senshi-moon.net">Ami</a>.
<p>
<br>
<b>:: About ::</b>
<p>
&nbsp&nbsp&nbsp Alright. A fanlisting is a site that well...lists fans of a certain topic or person or subject. There are fanlistings to actors, anime, anything you can imagine. There are a few <a href="http://www.geocities.com/thetenswords/fanlists/rules.html">rules</a> to joining, but usually, most people get accepted.
<p>
As you must has suspected by now, this fanlisting is dedicated to the relationship between Shinomori Aoshi and Seta Soujiro from the anime, Rurouni Kenshin. This is, their relationship in any sort of way, but particularly, a romantic one.
<p>
Why would they be such a great couple, you ask? Well, think about it. Though they never really had much screen time together in the anime, they share a lot in common in different ways. Both hide their emotions, but in different ways: Aoshi hides them inside his heart, while Soujiro hides them behind a smile. Both had tragic things happen to them, and both are looking for peace.
<p>
And where else to find peace than within eachother, right?
<P>
Also, they have some differences that sort of help them fit together. Soujiro is a bit more childlike and curious than Aoshi, who is more mature and weathered, it seems. Soujiro's constant happiness blends in with Aoshi's rare smiles and calmer personality.
<p>
Not to mention, they're so cute together! Viva la cuteness!
<p>
<b>:: Rules ::</b>
<p>
1. Of course. You must be a fan of Aoshi and Soujiro, in any sort of relationship.
<p>
2. List a real country and name when you apply, please. No names like Soujiro_fan_103 or whatever.
<p>
3. No flames, please. It's a waste of my time and yours.
<p>
4. If you have a website, please put up a code, and save it to your own server. If you don't, I won't list you.
<p>
<b>:: Join ::</b>
<p>
<FORM METHOD="POST" ACTION="http://cgi21.Freedback.com/mail.pl" target="_blank">
<INPUT TYPE="hidden" NAME="to" VALUE="thetenswords@yahoo.co.uk">
<INPUT TYPE="hidden" name="subject" VALUE="Joining Fanlisting.">
<INPUT TYPE="hidden" NAME="form" VALUE="http://www.senshi-moon.net/tears">
<INPUT TYPE="hidden" NAME="admin" VALUE="thetenswords@yahoo.co.uk">
<INPUT TYPE="hidden" NAME="language" VALUE="en">
<p>
<input name="name" value="name" size="20" style="background-color:transparent; color: black; font-face: verdana; font-size: 8pt; border: 1 black solid">
<br>
<input name="email" value="email" size="20" style="background-color:transparent; color:black; font-face: verdana; font-size: 8pt; border: 1 black solid">
<br>
<input name="country" value="country" size="20" style="background-color:transparent; color: black; font-face: verdana; font-size: 8pt; border: 1 black solid">
<br>
<input name="url" value="url" size="20" style="background-color:transparent; color: black; font-face: verdana; font-size: 8pt; border: 1 black solid">
<br>
<input name="comment" value="comment" size="20" style="background-color:transparent; color: black; font-face: verdana; font-size: 8pt; border: 1 black solid">
<br>
<br>
<INPUT TYPE="submit" NAME="Submit" value="Join" style="background-color:transparent; color: black; font-face: tahoma; font-size: 8pt; border: 1 black solid">
</FORM>
<p>
<b>:: Codes ::</b>
<p>
&nbsp&nbsp&nbsp <b>Remember:</b> Save these to your own server!<p>
<img src="http://www.senshi-moon.net/tears/fan/fl1.jpg">&nbsp
<img src="http://www.senshi-moon.net/tears/fan/fl2.jpg">&nbsp
<img src="http://www.senshi-moon.net/tears/fan/fl3.jpg">&nbsp
<img src="http://www.senshi-moon.net/tears/fan/fl4.jpg">&nbsp
<img src="http://www.senshi-moon.net/tears/fan/fl5.jpg">&nbsp
<p>
Text linkage is fine. If you'd like to donate a code, <a href="mailto:thetenswords@yahoo.co.uk">contact</a> me. I'd appreciate any banners from others, and I'll credit you, too!
<p><br>
<b>:: Miscellany ::</b>
<p>
<A HREF="javascript:popUp('http://www.senshi-moon.net/tears/fan/gallery.html')">Gallery</A>
<p>
<A HREF="javascript:popUp('http://www.senshi-moon.net/tears/fan/recs.html')">Fanfic Reccomendations</A>
<p>
<A HREF="javascript:popUp('http://www.senshi-moon.net/tears/fan/links.html')">Links Out</A>
<p>
<A HREF="javascript:popUp('http://www.senshi-moon.net/tears/fan/credits.html')">Credits</A>
<p>
</DIV>
</body></html>