I searched and it seems there was no resolution then or solution. This is my first css experimental page. When I open it in a browser there is still a white border on the right hand side an bottom of the page. How do I get the page to fit the window or vice versa? I was hoping to possibly use this stretching script with this if it worked cross browser.
According to the stats of the CUStOMERS at my site there are more than .oo1% of the people visiting my site using NS 7. My margins are pretty small and I cannot afford to lose a sale because I wasn't kind enough to make sure my page works in the browser THEY choose.....
<html>
<head>
<title>TheOne</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!-- ImageReady Styles (TheOne.psd) -->
<style type="text/css">
<!--
#TheOneSliced2-01 {
position:absolute;
left:0px;
top:0px;
width:786px;
height:5px;
}
#TheOneSliced2-02 {
position:absolute;
left:0px;
top:5px;
width:23px;
height:795px;
}
#TheOneSliced2-03 {
position:absolute;
left:23px;
top:5px;
width:761px;
height:38px;
}
#TheOneSliced2-04 {
position:absolute;
left:784px;
top:5px;
width:2px;
height:795px;
}
#TheOneSliced2-05 {
position:absolute;
left:23px;
top:43px;
width:32px;
height:3px;
}
#TheOneSliced2-06 {
position:absolute;
left:55px;
top:43px;
width:483px;
height:3px;
}
#TheOneSliced2-07 {
position:absolute;
left:538px;
top:43px;
width:246px;
height:44px;
}
#TheOneSliced2-08 {
position:absolute;
left:23px;
top:46px;
width:25px;
height:751px;
}
#TheOneSliced2-09 {
position:absolute;
left:48px;
top:46px;
width:488px;
height:75px;
}
#TheOneSliced2-10 {
position:absolute;
left:536px;
top:46px;
width:2px;
height:75px;
}
#TheOneSliced2-11 {
position:absolute;
left:538px;
top:87px;
width:167px;
height:222px;
}
#TheOneSliced2-12 {
position:absolute;
left:705px;
top:87px;
width:79px;
height:710px;
}
#TheOneSliced2-13 {
position:absolute;
left:48px;
top:121px;
width:450px;
height:676px;
}
#TheOneSliced2-14 {
position:absolute;
left:498px;
top:121px;
width:40px;
height:188px;
}
#TheOneSliced2-15 {
position:absolute;
left:498px;
top:309px;
width:207px;
height:488px;
}
#TheOneSliced2-16 {
position:absolute;
left:23px;
top:797px;
width:761px;
height:3px;
}
-->
</style>
<!-- End ImageReady Styles -->
</head>
<body style="background-color:#FFFFFF; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">
<!-- ImageReady Slices (TheOne.psd) -->
<div id="TheOneSliced2-01">
<img src="images/TheOneSliced2_01.png" width=786 height=5 alt="">
</div>
<div id="TheOneSliced2-02">
<img src="images/TheOneSliced2_02.png" width=23 height=795 alt="">
</div>
<div id="TheOneSliced2-03">
<img src="images/TheOneSliced2_03.png" width=761 height=38 alt="">
</div>
<div id="TheOneSliced2-04">
<img src="images/TheOneSliced2_04.png" width=2 height=795 alt="">
</div>
<div id="TheOneSliced2-05">
<img src="images/TheOneSliced2_05.png" width=32 height=3 alt="">
</div>
<div id="TheOneSliced2-06">
<img src="images/TheOneSliced2_06.png" width=483 height=3 alt="">
</div>
<div id="TheOneSliced2-07">
<img src="images/TheOneSliced2_07.png" width=246 height=44 alt="">
</div>
<div id="TheOneSliced2-08">
<img src="images/TheOneSliced2_08.png" width=25 height=751 alt="">
</div>
<div id="TheOneSliced2-09">
<img src="images/TheOneSliced2_09.png" width=488 height=75 alt="">
</div>
<div id="TheOneSliced2-10">
<img src="images/TheOneSliced2_10.png" width=2 height=75 alt="">
</div>
<div id="TheOneSliced2-11">
<img src="images/TheOneSliced2_11.png" width=167 height=222 alt="">
</div>
<div id="TheOneSliced2-12">
<img src="images/TheOneSliced2_12.png" width=79 height=710 alt="">
</div>
<div id="TheOneSliced2-13">
<img src="images/TheOneSliced2_13.png" width=450 height=676 alt="">
</div>
<div id="TheOneSliced2-14">
<img src="images/TheOneSliced2_14.png" width=40 height=188 alt="">
</div>
<div id="TheOneSliced2-15">
<img src="images/TheOneSliced2_15.png" width=207 height=488 alt="">
</div>
<div id="TheOneSliced2-16">
<img src="images/TheOneSliced2_16.png" width=761 height=3 alt="">
</div>
<!-- End ImageReady Slices -->
<script language="JavaScript">
//Comment trail script- By Kurt (kurt.grigg@virgin.net)
//Script featured on Dynamic Drive
//Visit http://www.dynamicdrive.com for this script and more
colours=new Array('#D1C2D5','#D1C2D5','#D1C2D5','#D1C2D5','#D1C2D5','#D1C2D5','#D1C2D5','#D1C2D5','#D1C2D5')
n = 8;
y = 0;
x = 0;
n6=(document.getElementById&&!document.all);
ns=(document.layers);
ie=(document.all);
d=(ns||ie)?'document.':'document.getElementById("';
a=(ns||n6)?'':'all.';
n6r=(n6)?'")':'';
s=(ns)?'':'.style';
if (ns){
for (i = 0; i < n; i++)
document.write('<layer name="dots'+i+'" top=0 left=0 width='+i/2+' height='+i/2+' bgcolor=#ff0000></layer>');
}
if (ie)
document.write('<div id="con" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
if (ie||n6){
for (i = 0; i < n; i++)
document.write('<div id="dots'+i+'" style="position:absolute;top:0px;left:0px;width:'+i/2+'px;height:'+i/2+'px;background:#ff0000;font-size:'+i/2+'"></div>');
}
if (ie)
document.write('</div></div>');
(ns||n6)?window.captureEvents(Event.MOUSEMOVE):0;
function Mouse(evnt){
y = (ns||n6)?evnt.pageY+4 - window.pageYOffset:event.y+4;
x = (ns||n6)?evnt.pageX+1:event.x+1;
}
(ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse;
function animate(){
o=(ns||n6)?window.pageYOffset:0;
if (ie)con.style.top=document.body.scrollTop;
for (i = 0; i < n; i++){
var temp1 = eval(d+a+"dots"+i+n6r+s);
randcolours = colours[Math.floor(Math.random()*colours.length)];
(ns)?temp1.bgColor = randcolours:temp1.background = randcolours;
if (i < n-1){
var temp2 = eval(d+a+"dots"+(i+1)+n6r+s);
temp1.top = parseInt(temp2.top);
temp1.left = parseInt(temp2.left);
}
else{
temp1.top = y+o;
temp1.left = x;
}
}
setTimeout("animate()",120);
}
animate();
// -->
</script>
</body>
</html>
Feel free to crtique it. I have other layers I will be adding with links with mouseovers.