This is where those who only use layout view get into trouble. Nothing in
FP will prevent you from doing exactly what you have done -
<td valign="top" width="430"><p align="center"><font
size="2"><b>Welcome
to New Jersey Boxer Rescue</b></font></p>
<p align="justify"><font size="2"><b>NJBR is a non
profit,
501 C3 organization that provides complete
surrender
and adoption services, as well as promoting
responsible
pet ownership in New Jersey and it's surrounding
areas.</b></font></p>
<div style="position: absolute; width: 898px; height:
130px; z-index:
1; left: 258px; top: 1px; right:0; bottom:0" id="layer1">
Note that the 'layer' (that's the <div> at the bottom of the code snippet)
falls *after* the <td> (at the top) and before the </td> (not shown).
This means that the layer is in a table cell. That's bad mojo.
A layer is nothing more than an absolutely positioned page element. The
rule is that one should never place absolutely positioned elements
directly into table cells. But that's what you have done. You can fix
this by the following process (it's code intensive, so get ready) (I'm
using FP2003 - your mileage may vary):
1. open split view so you can see both code and design.
2. click anywhere within that layer at the top of the page in design view
and look at the tag selector bar at the top of the split view.
3. click on the first occurrence of "<div>" at the right of the 'parade'
of tags that you see there (this will select all of the markup for that
div tag).
4. (THIS IS VERY IMPORTANT) - click on the 'thumb', i.e., the slider on
the code view display's scrollbar to place focus in code view, and then
use Ctrl-X to cut that markup from the page - this will cause the layer to
disappear from design view.
5. scroll the page code view down until you can see </body> (for me, it's
on line 272) and click just to its left, so that the insertion point is
immediately before "</body>" on line 272.
6. press Ctrl-V to paste the layer code back to the page.
At this point, you have moved the layer's code out of the table cell and
placed it back on the page, immediately above the closing body tag. In
other words, it's no longer in the table. Amazingly, you should still see
the layer in the same place in design view - that's because it's
absolutely positioned, so where you see it on the screen doesn't depend on
where you see its code in the code view.
If you do *not* see it still on the screen, you have most likely not
changed focus from the design view to the code view in step 4. Close the
page without saving it, and try again.
Now you will be ready for the next step. This one is required because you
have used a centering table - it's the table that is moving away from the
layer, not the layer that is moving away from the table.
Assuming that you have properly executed the steps above, continue with
the following....
Change this -
</head>
to this -
<style type="text/css">
<!--
body { text-align:center; color:#CCC; }
#wrapper { text-align:left; width:720px; margin:0
auto;position:relative; }
-->
</style>
</head>
change this -
<body ...>
to this -
<body ...>
<div id="wrapper">
and this -
</body>
to this -
</div><!-- /wrapper -->
</body>
and see if that helps. Your layer should now center along with your table
and you should be all tickety boo.... 8)
By the way, please change this -
ownership in New Jersey and it's surrounding areas.
to this -
ownership in New Jersey and its surrounding areas.
--
Murray
--------------
MVP FrontPage
Lindsey said:
<html>
<head>
<title>New Jersey Boxer Rescue Inc.</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="description" content="Type a brief description of your web
site
here.">
<meta name="keywords" content="keyword, keyword, keyword phrase, keyword
phrase, keyword phrase, keyword phrase">
<meta name="copyright" content="2006 New Jersey Boxer Rescue, Inc. All
rights reserved.">
<meta name="robots" content="all">
<meta name="revisit-after" content="14 days">
<link rel="stylesheet" href="btstyle625.css" type="text/css">
<script language="JavaScript">
function doClock(){
var t=new Date(),a=doClock.arguments,str="",i,a1,lang="1";
var month=new Array('January','Jan', 'February','Feb', 'March','Mar',
'April','Apr', 'May','May', 'June','Jun', 'July','Jul', 'August','Aug',
'September','Sep', 'October','Oct', 'November','Nov', 'December','Dec');
var tday= new Array('Sunday','Sun','Monday','Mon', 'Tuesday','Tue',
'Wednesday','Wed','Thursday','Thr','Friday','Fri','Saturday','Sat');
for(i=0;i<a.length;i++) {a1=a
.charAt(1);switch (a.charAt(0)) {
case "M":if ((Number(a1)==3) && ((t.getMonth()+1)<10)) str+="0";
str+=(Number(a1)>1)?t.getMonth()+1:month[t.getMonth()*2+Number(a1)];break;
case "D": if ((Number(a1)==1) && (t.getDate()<10))
str+="0";str+=t.getDate();break;
case "Y":
str+=(a1=='0')?t.getFullYear():t.getFullYear().toString().substring(2);break;
case "W":str+=tday[t.getDay()*2+Number(a1)];break; default:
str+=unescape(a);}}return str;
}
function FP_swapImg() {//v1.0
var doc=document,args=arguments,elm,n; doc.$imgSwaps=new Array();
for(n=2;
n<args.length;
n+=2) { elm=FP_getObjectByID(args[n]); if(elm) {
doc.$imgSwaps[doc.$imgSwaps.length]=elm;
elm.$src=elm.src; elm.src=args[n+1]; } }
}
function FP_preloadImgs() {//v1.0
var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new Array();
for(var i=0; i<a.length; i++) { d.FP_imgs=new Image;
d.FP_imgs.src=a; }
}
function FP_getObjectByID(id,o) {//v1.0
var c,el,els,f,m,n; if(!o)o=document; if(o.getElementById)
el=o.getElementById(id);
else if(o.layers) c=o.layers; else if(o.all) el=o.all[id]; if(el) return
el;
if(o.id==id || o.name==id) return o; if(o.childNodes) c=o.childNodes;
if(c)
for(n=0; n<c.length; n++) { el=FP_getObjectByID(id,c[n]); if(el) return
el; }
f=o.forms; if(f) for(n=0; n<f.length; n++) { els=f[n].elements;
for(m=0; m<els.length; m++){ el=FP_getObjectByID(id,els[n]); if(el)
return
el; } }
return null;
}
</script>
</HEAD>
<BODY LEFTMARGIN="0" TOPMARGIN="0" MARGINWIDTH="0" MARGINHEIGHT="0"
onload="FP_preloadImgs(/*url*/'button40.jpg', /*url*/'button41.jpg',
/*url*/'button49.jpg', /*url*/'button4A.jpg', /*url*/'button4C.jpg',
/*url*/'button4D.jpg', /*url*/'button4F.jpg', /*url*/'button50.jpg',
/*url*/'button52.jpg', /*url*/'button53.jpg')">
<br>
<table width="808" border="0" cellspacing="0" cellpadding="0"
align="center">
<tr>
<td class="btbrdr">
<table width="750" border="0" cellspacing="0" cellpadding="0"
align="center" height="115">
<tr>
<td valign="top">
<div align="center">
<img src="header.jpg" width="928" height="115" border="0"></div>
</td>
</tr>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0"
height="958">
<tr>
<td class="btcontent">
<p> </p>
<table width="751" border="0" cellspacing="0" cellpadding="6"
align="center" height="729">
<tr>
<td valign="top" width="160">
<table width="100%" border="0" cellspacing="0"
cellpadding="5" height="1623">
<tr>
<td class="bttitle">
<div align="center"><u>New Dogs</u></div>
<div align="center"> </div>
<div align="center"><a href="availablenow.asp">Click Here To See All
Available Dogs</a></div>
</td>
</tr>
<tr>
<td class="btnavbk" valign="top">
<p align="center">
<img src="Sammy_t1a.JPG" width="100" height="75" vspace="3"
hspace="3"><br>
1-11-06: Sammy said:
</p>
<p align="center">
<img src="Lexi_t1a.jpg" width="100" height="97" vspace="3"
hspace="3"><br>
1-10-06: Lexi <span
class="btdetails">
<p align="center">
<img src="Prince_t1a.JPG" width="100" height="75" vspace="3"
hspace="3"><br>
1-9-06: Prince
<p align="center">
<img src="beta_t.jpg" width="100" height="83" vspace="3" hspace="3"><br>
1-4-06: Beta <span
class="btdetails">
<a
href="http://search.petfinder.com/petnote/displaypet.cgi?petid=5601563">Details
</p>
<p align="center">
<img src="ko_t.jpg" width="100" height="67" vspace="3" hspace="3"><br>
1-4-06: K.O <span
class="btdetails">
<a
href="http://search.petfinder.com/petnote/displaypet.cgi?petid=5601545">Details
<p align="center">
<img src="buddy%203_t.jpg" width="100" height="96" vspace="3"
hspace="3"><br>
1-4-06: Buddy
<a
href="http://search.petfinder.com/petnote/displaypet.cgi?petid=5601501">
<p align="center">
<img src="Baby%20Carl_t.jpg" width="100" height="77" vspace="3"
hspace="3"><br>
1-2-06: Baby Carl <span class="btdetails">
<a
href="http://search.petfinder.com/petnote/displaypet.cgi?petid=5588938">Details
</p>
<p align="center">
<img src="jake3_t.jpg" width="100" height="76" vspace="3"
hspace="3"><br>
12-26-05: Jake <span
class="btdetails">
<a
href="http://search.petfinder.com/petnote/displaypet.cgi?petid=5551713">Details
<p align="center">
<img src="bev_t.jpg" width="100" height="86" vspace="3" hspace="3"><br>
12-21-05: Bevis
<a
href="http://search.petfinder.com/petnote/displaypet.cgi?petid=5549437">
<p align="center">
<img src="Sol_t.jpg" width="100" height="106" vspace="3" hspace="3"><br>
12-13-05: Sol <span
class="btdetails">
<a
href="http://www.petfinder.com/pet.cgi?ac...3ca-app3&display=&preview=1&row=0&tmpl=&stat=">Details
</p>
<p align="center">
<img src="Kia_t.jpg" width="100" height="78" vspace="3" hspace="3"><br>
12-10-05: Kia <span
class="btdetails">
<a
href="http://www.petfinder.com/pet.cgi?ac...87c-app3&display=&preview=1&row=0&tmpl=&stat=">Details
<p align="center">
</p>
<p align="center">
</p>
<p align="center">
</p>
<p align="center">
</p>
<p align="center">
</p>
<p align="center">
</p>
<p align="center">
</p>
<p align="center">
</p>
<p align="center">
</p>
<p align="center">
</p>
<p align="center">
</p>
<p align="center">
</p>
</td>
</tr>
<tr>
<td class="bttitle">
<div align="center">FAQ'S Regarding Adoption Fee &
Dog
Surrenders</div>
</td>
</tr>
<tr>
<td id="nav" valign="top" class="btnavbk"> </td>
</tr>
</table>
</td>
<td valign="top" width="430">
<p align="center"><font size="2"><b>Welcome to New
Jersey
Boxer Rescue</b></font></p>
<p align="justify"><font size="2"><b>NJBR is a non profit,
501 C3 organization that provides complete surrender and
adoption services, as well as promoting responsible pet
ownership in New Jersey and it's surrounding areas.</b></font></p>
<div style="position: absolute; width: 898px; height: 130px; z-index:
1; left: 258px; top: 1px; right:0; bottom:0" id="layer1">
<p><b><font size="3" color="#FFFFFF"> </font></b></p>
<p><b><font size="5" color="#FFFFFF"> New Jersey Boxer
Rescue, Inc.</font></b></p>
<p> <p>
<a href="index.htm.asp">
<img border="0" id="img2" src="button3F.jpg" height="22" width="125"
alt="Home" fp-style="fp-btn: Corporate 8; fp-font-style: Bold;
fp-proportional: 0" fp-title="Home"
onmouseover="FP_swapImg(1,0,/*id*/'img2',/*url*/'button40.jpg')"
onmouseout="FP_swapImg(0,0,/*id*/'img2',/*url*/'button3F.jpg')"
onmousedown="FP_swapImg(1,0,/*id*/'img2',/*url*/'button41.jpg')"
onmouseup="FP_swapImg(0,0,/*id*/'img2',/*url*/'button40.jpg')"></a>
<a href="adoptionprocess.asp">
<img border="0" id="img7" src="button48.jpg" height="22" width="125"
alt="Adoption"
onmouseover="FP_swapImg(1,0,/*id*/'img7',/*url*/'button49.jpg')"
onmouseout="FP_swapImg(0,0,/*id*/'img7',/*url*/'button48.jpg')"
onmousedown="FP_swapImg(1,0,/*id*/'img7',/*url*/'button4A.jpg')"
onmouseup="FP_swapImg(0,0,/*id*/'img7',/*url*/'button49.jpg')"
fp-style="fp-btn: Corporate 8; fp-font-style: Bold; fp-proportional: 0"
fp-title="Adoption"></a>
<a href="surrendorprocess.asp">
<img border="0" id="img8" src="button4B.jpg" height="22" width="125"
alt="Surrender A Dog"
onmouseover="FP_swapImg(1,0,/*id*/'img8',/*url*/'button4C.jpg')"
onmouseout="FP_swapImg(0,0,/*id*/'img8',/*url*/'button4B.jpg')"
onmousedown="FP_swapImg(1,0,/*id*/'img8',/*url*/'button4D.jpg')"
onmouseup="FP_swapImg(0,0,/*id*/'img8',/*url*/'button4C.jpg')"
fp-style="fp-btn: Corporate 8; fp-font-style: Bold; fp-proportional: 0"
fp-title="Surrender A Dog"></a>
<a href="fosterhome.asp">
<img border="0" id="img9" src="button4E.jpg" height="22" width="125"
alt="Foster"
onmouseover="FP_swapImg(1,0,/*id*/'img9',/*url*/'button4F.jpg')"
onmouseout="FP_swapImg(0,0,/*id*/'img9',/*url*/'button4E.jpg')"
onmousedown="FP_swapImg(1,0,/*id*/'img9',/*url*/'button50.jpg')"
onmouseup="FP_swapImg(0,0,/*id*/'img9',/*url*/'button4F.jpg')"
fp-style="fp-btn: Corporate 8; fp-font-style: Bold; fp-proportional: 0"
fp-title="Foster"></a>
<a href="aboutus.asp">
<img border="0" id="img10" src="button51.jpg" height="22" width="125"
alt="About Us" fp-style="fp-btn: Corporate 8; fp-font-style: Bold;
fp-proportional: 0" fp-title="About Us"
onmouseover="FP_swapImg(1,0,/*id*/'img10',/*url*/'button52.jpg')"
onmouseout="FP_swapImg(0,0,/*id*/'img10',/*url*/'button51.jpg')"
onmousedown="FP_swapImg(1,0,/*id*/'img10',/*url*/'button53.jpg')"
onmouseup="FP_swapImg(0,0,/*id*/'img10',/*url*/'button52.jpg')"></a></div>
<p align="center"><b><font color="#FF0000" size="3">**Senior
Boxers Need Homes**</font></b></p>
<p align="center">
<img border="0" src="bev%20head%20shot.jpg" width="300" height="301"></p>
<p align="center"><font size="2">Bevis needs a foster home
now. He lost his one and only home after 10 years and now
waits in a kennel for us to find him a foster or forever
home. If you can help poor Bevis, please email</font></p>
<p align="center"><font size="2">
<a href="mailto:[email protected]?subject=Bevis">
(e-mail address removed) </a> ASAP</font></p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"><font size="3"><b>Interested in a Boxer?</b></font></p>
<p align="center">
<img border="0" src="boxer%20looking%20cute.jpg" width="300"
height="224"></p>
<p align="center"><font size="2">The boxer is an amazing
breed. Not only are they adorable, they are some of
the most affectionate animals. Besides being a great
animal, boxers are a handful. They need love and
attention just like everyone else, we hate seeing our boxers
pushed in and out of homes for whatever reason.</font></p>
<p align="center"><font size="2">Take a moment and read this
to see if the boxer is the right dog for you.
<a href="http://www.boxer-dog.org/item/17">Click Here</a></font></p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </td>
<td valign="top" width="160">
<div align="center"><span class="btdate">
<script language="JavaScript">
document.write(doClock("M0","%20","D1",",%20","Y0"));
</script>
</span>
</div>
<table width="100%" border="0" cellspacing="0"
cellpadding="5">
<tr>
<td class="bttitle">
<div align="center"><u>Recently Adopted</u></div>
<div align="center"> </div>
<div align="center"><a href="adopted.asp">Click Here To See All
Adopted Dogs</a></div>
</td>
</tr>
<tr>
<td class="btnavbk" valign="top">
<p align="center">
<img src="tinkerbell2_t.jpg" width="100" height="110" vspace="3"
hspace="3"><br>
1-8-06: Tinkerbell <br>
</p>
<p align="center">
<img src="Rosco_t.jpg" width="100" height="88" vspace="3"
hspace="3"><br>
1-8-06: Rosco </p>
<p align="center">
<img src="georgeandlinden2.jpg" width="100" height="74" vspace="3"
hspace="3"><br>
1-8-06: Linden & George </p>
<p align="center">
<img src="Max5_t.jpg" width="100" height="92" vspace="3" hspace="3"><br>
1-8-06: Max </p>
<p align="center">
<img src="callie_t.jpg" width="100" height="109" vspace="3"
hspace="3"><br>
12-20-05: Callie </p>
<p align="center">
<img src="Jersey_t.jpg" width="100" height="86" vspace="3"
hspace="3"><br>
12-20-05: Jersey </p>
<p align="center">
<img src="Powder_t.jpg" width="100" height="91" vspace="3"
hspace="3"><br>
12-20-05: Powder </p>
<p align="center">
<img src="rocky-white3_t.jpg" width="100" height="84" vspace="3"
hspace="3"><br>
12-20-05: Rocky </p>
<p align="center">
<img src="Bella2_t.jpg" width="100" height="75" vspace="3"
hspace="3"><br>
12-6-05: Baby Bella </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
<p align="center"> </p>
</td>
</tr>
<tr>
<td class="bttitle">
<div align="center"> Photo
Gallery Coming Soon</div>
</td>
</tr>
<tr>
<td id="nav" valign="top" class="btnavbk"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
<table width="750" border="0" cellspacing="0" cellpadding="2"
align="center">
<tr>
<td class="btcopyrights">
<div align="center">© 2006 New Jersey Boxer Rescue Inc. All rights
reserved.</div>
</td>
</tr>
</table>
</BODY>
</HTML>
Murray said:
im using frontpage 2003, i have this header and i put a layer over it
so i
can place buttons where i want, it looks fine but then it moves
depending
on
browswer size
Layers don't move. It's the content under it that is moving. Show me
your
code, please, so I can make relevant suggestions.
--
Murray
--------------
MVP FrontPage
im using frontpage 2003, i have this header and i put a layer over it
so i
can place buttons where i want, it looks fine but then it moves
depending
on
browswer size, how do i make it so that the layer stays where it is,
and
not
moving depending on browser size
