Link to home
Start Free TrialLog in
Avatar of rjmiller15
rjmiller15

asked on

Layers - how to line up correctly?

I have a template which I needed to edit a lot.  The main table built into the css had 2 columns.  I created a layer to span the two columns so I could have a wider area of text.  I also wanted to add some menu titles on top of a bg image.

I cannot get my layers to line up.  If they line up in DW, they don't in IE and vice versa.  How can I make my layers line up - and work across any screen resolution?
Avatar of rockmansattic
rockmansattic

layers and tables are not compatable like this.
you can put a table inside a layer (think of it like a transparency for overhead projectors)
but cannot (tmk) put a layer inside a table.  

But you can always line up layers using absolute positioning.

<div id="Layer1" style="position:absolute; left:115px; top:97px; width:267px; height:84px; z-index:1"></div>


do you have an online example?
Rockman
Avatar of rjmiller15

ASKER

http://www.thelifefocuscenter.com/index.htm

I used absolute positioning and it didn't work -
Sorry, reread you question:
" If they line up in DW, they don't in IE and vice versa"
so you want to them to look the same for you.!

DW is simply a tool for such things, it is not perfect for lining up itmes (by visual ques)  They may not look the same beacuse of several reasons, one could be becasue of invisable scripting   >>view>>visual aids   may be turned on, and there for shifting things.  The main thing is that they line up in a browser.

Rockman
In other words I will line up the div (layer) in DW and when I check it in Internet Explorer - it's all out of whack.  I adjust it in DW and check IE and it's all out of whack there.

It I get it lining up in the browser - other screen resolutions make it all messed up.
First off , cross browser is always going to be an issue.  Maby not to this extent, but that is one thing we always are considering.  What I ment in my post is that you cant completly rely on DW to adjust layers and pixles.  Making a site cross browser can be a  slightly different issue.

just an idea (if Im seeing this correct)

change
<div id="Layer4" style="position:absolute; left:131px; top:548px; width:252px; height:130px; z-index:4">
                                  <div class="style5" style="padding-left:20px "> 

to

<div id="Layer4" class="style5" style="position:absolute; left:131px; top:548px; width:252px; height:130px; z-index:4">
                             
close to line 122

is that where your issue is?

You're thinking that DW is a WYSIWYG tool. It's not. It's a WYSISWYG, or WYSINWYG -- sometimes you get what you see in DW, most times you don't.

For that reason, using layers the way you are isn't the way to go about this. If you need to span 2 columns of a table, that's what colspan is for. If you want to add a title to an image, it probably shouldn't be a background. That implies you're putting something else (probably text) on top of it, which often means it isn't readable. If you want to add a copyright line, you can do that directly on the image, or add another cell under that one and put it there, very small.

You don't need layers for any of that.  
ASKER CERTIFIED SOLUTION
Avatar of bitter_chicken
bitter_chicken
Flag of Australia image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Bitter Chicken's answer is by FAR the BEST answer I have ever received from EE.  Thanks so much to you!!!!

wow i'm ego tripping

^ ^ click that little feedback link ^ ^

that way i can forever be reminded how damn good i am

bc ;-)