PDA

View Full Version : Layer positioning



estateboy
November 8th, 2006, 03:50 AM
Hi guys,

I'm making submenu's using layers but how do I prevent that the position from a layer change when the site is seen on screens with different resolutions? I gave the layers absolute positions but that doesn't work properly! On my own computer everything seems okay (if I don't change the resolution) but on a computer with a higher resolution and/or bigger dimensions(19") the submenu's appear on a different place (logical). What should i do to prevent this?

Thanks a lot

amaze
November 8th, 2006, 05:23 AM
try giving them relative positions.
(0,0) the top-most left-most unoccupied position in its parent.
Setting position to relative then left to the width of the parent should position it outside the left edge of its parent.

estateboy
November 8th, 2006, 05:38 AM
try giving them relative positions.
(0,0) the top-most left-most unoccupied position in its parent.
Setting position to relative then left to the width of the parent should position it outside the left edge of its parent.

Thanks for the responce:thumb: but can you be a little be more detailed? I'm using text for the normal menu items. Example: I have the word directions as a menu item. When I roll over directions the submenu directions becomes visible. Does this mean that the word Directions in the menu is the parent? And if so, how do I know the position of the parent while the complete site (table) is centred!

Thanks in advance

amaze
November 8th, 2006, 05:53 AM
Let's say your centered site is a centered table and your text menu is in the first row with a 100px height.
Then the subMenus will be as follows:


<div id="subMenu1" style="position:absolute; left:auto; top:100px; height:auto; z-index:1;">subMenu1</div>
<div id="subMenu2" style="position:absolute; left:auto; top:100px; height:auto; z-index:1; padding-left:50px">subMenu2</div>

...and so on.

Mind the left:auto part which helps your layer start from the left start of your site(of the centered table).
Also mind the padding-left part on the second subMenu (subMenu2) which is used to put it after the first one(50px if subMenu1's width is 50px)

Let me know if that works

estateboy
November 8th, 2006, 06:04 AM
Hi Thankxs

I'm gonna work on this one and let you know how it goes.

Cheers


Let's say your centered site is a centered table and your text menu is in the first row with a 100px height.
Then the subMenus will be as follows:

<div id="subMenu1" style="position:absolute; left:auto; top:100px; height:auto; z-index:1;">subMenu1</div>
<div id="subMenu2" style="position:absolute; left:auto; top:100px; height:auto; z-index:1; padding-left:50px">subMenu2</div>

...and so on.

Mind the left:auto part which helps your layer start from the left start of your site(of the centered table).
Also mind the padding-left part on the second subMenu (subMenu2) which is used to put it after the first one(50px if subMenu1's width is 50px)

Let me know if that works

estateboy
November 9th, 2006, 03:40 AM
That works perfect tahks a lot


Let's say your centered site is a centered table and your text menu is in the first row with a 100px height.
Then the subMenus will be as follows:


<div id="subMenu1" style="position:absolute; left:auto; top:100px; height:auto; z-index:1;">subMenu1</div>
<div id="subMenu2" style="position:absolute; left:auto; top:100px; height:auto; z-index:1; padding-left:50px">subMenu2</div>

...and so on.

Mind the left:auto part which helps your layer start from the left start of your site(of the centered table).
Also mind the padding-left part on the second subMenu (subMenu2) which is used to put it after the first one(50px if subMenu1's width is 50px)

Let me know if that works