Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

ALIGNMENT PROBLEM WITH LAYERS. HELP!!

Status
Not open for further replies.

prismshian

Programmer
Jan 25, 2007
5
CN
Hi there, THANKS IN ADVANCE!

I've created a whole website design in fireworks. So i export it as HTML so I can add layers on top of my cool background i designed in fireworks.

I export it, click 'body' and 'align centre' I want the page to be centre of the screen. Add layers and words. And when i preview in browser, the layer SWIMS around the page, i can resize it and the words are NOT STUCK to the background i designed in fireworks.

Now, i know some of you will grab a hammer and hit me on the head because its such an easy solution to it, but that's why i'm here cause i cant do it! and there's no such thing as a stupid question! help!!

 
post an URL or look towards topics of 'relative vs. absolute layer'.
Now as far as future is concerned...well, my advise was and still is that you should not assume that 'designer tools' (such as firewors,adobe go live,PS..etc) are good 'programmer tools'. Best you use image editing tools to create/slice images and then re-create the html in DW....sure use the one that program spits out just so you know how things are to look...remember it is not the images but the code that drives your site. ;-)
All the best!

:--------------------------------------:
fugitive.gif


All around in my home town,
They tryin' to track me down...
 
Hey there,

Thanks for the response, but it seems a little..more complicated :)

I basically exported my fireworks stuff as slices, so dreamweaver opens them as tables, so basically i think we have a gif in a table, and i align that table center. So that table is dead center of the screen in IE.

Now the layer doesn't centre with the body, neither does it stick to the table, when i move the windows an enlarge it, the text in the layer, moves with the screen size lol. Not the background which its supposed to be stuck with.

know what i mean? i've been saerching and searching and it seems taht layers cannot be stuck to tables. which means you cant place a layer on top of a table or an image in center aligned body.

Any help for this? cause i beleive i'm ignorant about something somewhere, maybe a code to do this.

 
As lebisol has already said can we have a URL or the code. Other that that make sure line 23 of your code reads
Code:
<% &*((9  86896955jhgfvvjh j jh gjhgjghgyk %>

[Peace][Pipe]
 
Okay basically i think the 'key' part is the layer section, i need to get it relative to the background. i think... :)


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "<!-- saved from url=(0014)about:internet -->
<html>
<head>
<title>Alignment Problem.gif</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<!--Fireworks 8 Dreamweaver 8 target. Created Fri Jan 26 17:43:55 GMT+0800 (China Standard Time) 2007-->
<script language="JavaScript">
<!--
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers.document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a)&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a.indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a;}}
}

//-->
</script>
<style type="text/css">
<!--
#Layer1 {
position:absolute;
width:200px;
height:115px;
z-index:1;
left: 495px;
top: 132px;
}
-->
</style>
<script type="text/javascript">
<!--
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
//-->
</script>
</head>
<body bgcolor="#ffffff" onLoad="MM_preloadImages('images 2/Alignment%20Problem_r2_c2_f2.gif');">
<div align="center">
<div id="Layer1">
<p>This layer was added in Macromedia. It does not stick to the page. Try to resize the page and you shall see it swimming around :)</p>
<p>I need to get this to stick to the background....</p>
</div>
<table border="0" cellpadding="0" cellspacing="0" width="600">
<!-- fwtable fwsrc="Untitled" fwbase="Alignment Problem.gif" fwstyle="Dreamweaver" fwdocid = "256126478" fwnested="0" -->
<tr>
<td><img src="images 2/spacer.gif" width="190" height="1" border="0" alt=""></td>
<td><img src="images 2/spacer.gif" width="226" height="1" border="0" alt=""></td>
<td><img src="images 2/spacer.gif" width="184" height="1" border="0" alt=""></td>
<td><img src="images 2/spacer.gif" width="1" height="1" border="0" alt=""></td>
</tr>

<tr>
<td colspan="3"><img name="AlignmentProblem_r1_c1" src="images 2/Alignment%20Problem_r1_c1.gif" width="600" height="20" border="0" alt=""></td>
<td><img src="images 2/spacer.gif" width="1" height="20" border="0" alt=""></td>
</tr>
<tr>
<td rowspan="2"><img name="AlignmentProblem_r2_c1" src="images 2/Alignment%20Problem_r2_c1.gif" width="190" height="580" border="0" alt=""></td>
<td><a href="javascript:;" onMouseOut="MM_swapImgRestore();" onMouseOver="MM_swapImage('AlignmentProblem_r2_c2','','images 2/Alignment%20Problem_r2_c2_f2.gif',1);"><img name="AlignmentProblem_r2_c2" src="images 2/Alignment%20Problem_r2_c2.gif" width="226" height="92" border="0" alt=""></a></td>
<td rowspan="2"><img name="AlignmentProblem_r2_c3" src="images 2/Alignment%20Problem_r2_c3.gif" width="184" height="580" border="0" alt=""></td>
<td><img src="images 2/spacer.gif" width="1" height="92" border="0" alt=""></td>
</tr>
<tr>
<td><img name="AlignmentProblem_r3_c2" src="images 2/Alignment%20Problem_r3_c2.gif" width="226" height="488" border="0" alt=""></td>
<td><img src="images 2/spacer.gif" width="1" height="488" border="0" alt=""></td>
</tr>
</table>
</div>
</body>
</html>
 
I LOVE how you cant edit your posts in this forum.:)

Dear people, i've found the solution, the solution is that, THERE IS NO SOLUTION! As the saying goes with RTMF! (Read the freaking manual)

This is what the dreamweaver help says:

"You cannot create a CSS-based layout with layers and then center the contents of the page.Dreamweaver layers are absolutely positioned elements. That is, they have a specific position that is set relative to the top and left margins of the page."

So it is good i learn something after 48 hours of searching for nothing :) I love this stuff.
 
:)
it always is
ooo end don't get me started on TT forums 'functions'
All the best!

:--------------------------------------:
fugitive.gif


All around in my home town,
They tryin' to track me down...
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top