layer problems

R

Rick

What's going on when I place a picture in my layer and give it an absolute
position and then when I view it with different browser settings (600x800) or
(1280x1024) it appears in different positions on the page.

Is there a fix or work around for this.
 
A

Andrew Murray

It's not "different positions" it will appear that way because you change
the screen resolution.

If you set it at 100 pixels from the left in 800x600, it will still be 100
pixels from the left on 1024x 768 or whatever.

Absolute Positioning is exactly that - Absolute - unchanging.

You're better off using tables to make your layout rather than layers.

Can you provide an example page on your site of what you're gettting?
 
M

Murray

it will appear that way because you change the screen resolution.

Actually you would see the same thing by changing the browser viewport width
at the same resolution. Conclusion? Resolution has nothing to do with it.
 
M

Murray

Two problems -

1. <table border="0" style="border-collapse: collapse" width="100%"
id="table2">
<tr>
<td align="center">

Mixing center aligning content with absolutely positioned elements - this is
what produces your symptoms.

2. <table border="0" style="border-collapse: collapse" width="100%"
id="table2">
<tr>
<td align="center">

<dl>
<div style="position: absolute; width: 100px; height: 100px; z-index: 3;
left: 392px; top: 213px; visibility: hidden" id="layer4">

Placing an absolutely positioned element directly into a table cell. This
will haunt you - never do it. Absolutely positioned elements should never
be placed directly into tables because it confuses some browsers as to where
exactly they should be positioned.

Two solutions -

1. Remove all your layer markup (i.e., from '<div id=' thorough '</div>',
inclusive) from the table cells, and paste it back onto the page immediately
above </body>.

2. Having done that, then change this -

</head>

to this -

<style type="text/css">
<!--
body { text-align:center; }
#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.
 
R

Rick

Thank you,
I will try this.

Murray said:
Actually you would see the same thing by changing the browser viewport width
at the same resolution. Conclusion? Resolution has nothing to do with it.
Click to expand...
 
R

Rick

Thanks Murray,
That did the trick.

Murray said:
Actually you would see the same thing by changing the browser viewport width
at the same resolution. Conclusion? Resolution has nothing to do with it.
Click to expand...
 
K

Kim Me

I was reading this posting and have a similar problem. I went thru that and
did as you advised. From the beginning everything was looking fine in
Explorer and Netscape 7.2 but all over the place in Netscape 4.7. Now the
page isn't even visible in Netscape 4.7 but wks fine in all the other
brewers. Any idea what's wrong?
Thanks
 
T

Tom Pepper Willett

IMO, I would not worry about NS 4X. The amount of users are neglible at
this point.
--
===
Tom "Pepper" Willett
Microsoft MVP - FrontPage
---
FrontPage Support:
http://www.frontpagemvps.com/

About FrontPage 2003:
http://office.microsoft.com/home/office.aspx?assetid=FX01085802
===
|
| I was reading this posting and have a similar problem. I went thru that
and
| did as you advised. From the beginning everything was looking fine in
| Explorer and Netscape 7.2 but all over the place in Netscape 4.7. Now the
| page isn't even visible in Netscape 4.7 but wks fine in all the other
| brewers. Any idea what's wrong?
| Thanks
|
| "Murray" wrote:
|
| > You're welcome!
| >
| > --
| > Murray
| > ============
| >
| > | > > Thanks Murray,
| > > That did the trick.
| > >
| > > "Murray" wrote:
| > >
| > >> > it will appear that way because you change the screen resolution.
| > >>
| > >> Actually you would see the same thing by changing the browser
viewport
| > >> width
| > >> at the same resolution. Conclusion? Resolution has nothing to do
with
| > >> it.
| > >>
| > >> --
| > >> Murray
| > >> ============
| > >>
| > >> | > >> > It's not "different positions" it will appear that way because you
| > >> > change
| > >> > the screen resolution.
| > >> >
| > >> > If you set it at 100 pixels from the left in 800x600, it will still
be
| > >> > 100
| > >> > pixels from the left on 1024x 768 or whatever.
| > >> >
| > >> > Absolute Positioning is exactly that - Absolute - unchanging.
| > >> >
| > >> > You're better off using tables to make your layout rather than
layers.
| > >> >
| > >> > Can you provide an example page on your site of what you're
gettting?
| > >> >
| > >> >
| > >> >
| > >> > | > >> >> What's going on when I place a picture in my layer and give it an
| > >> >> absolute
| > >> >> position and then when I view it with different browser settings
| > >> >> (600x800) or
| > >> >> (1280x1024) it appears in different positions on the page.
| > >> >>
| > >> >> Is there a fix or work around for this.
| > >> >
| > >> >
| > >>
| > >>
| > >>
| >
| >
| >
 
M

Murray

Of course. NN4x will not accept such code at all. That's why most people
who create sites professionally and who use CSS layout methods, use @import
to bring in their external stylesheets. NN4x doesn't do @import and so it
renders an unstyled page. If your semantic markup is good, the page will
still be completely functional.
 
L

Lae135

Murray! Thank you. I had the very same problem and I used your code, it
worked for me too!!

Makes perfect sense. I have only been using FP03 since Feb. I am still
learning!

www.221cedarwoodlane.com

Thanks again!
Linda
 
Top