Centering multiple layers

technosponge · #1 (**permalink**) Jan 17th, 2006, 18:13

I'm trying to design my personal site. I have it set up to where it would fit perfectly horizontally in an 800x600 screen with a background layout, an iframe and a menu layer. I would like to be able to set everything up so that if the resolution gets bigger, all of the conent will stay in the same relative position, but be centered on the page. Any ideas?

the background is in a layer that is centered. The menu layer needs to be about 50px below the top of the background image and about 100px to the left of the left side of the bg image. the iframe should be about 20px from the bottom of the bottom of the bg image and about 40px from the right of the right side of the background image.

here's what my layout looks like, and some arrows as to how it should be. I haven't made the menu yet, so it isn't on there.
http://www.quest4him.org/shantih/layoutexe.gif

here's the code that shows what i have so far:
http://www.quest4him.org/shantih/layoutcodeexe.gif

herkalees · #2 (**permalink**) Jan 19th, 2006, 04:23

This here is one step in your process, it'll help center the page on all resolutions:

Wrap everything in this:
<body>
<div id="wrap">

.. all code goes here ..

</div>
</body>

Then, do this with CSS:
#wrap {width:760px; position:relative; left:50%; margin-left:-380px;}

It's late and I'm tired, so that's probably right. Assuming it is, you can go from there and position the other parts.

technosponge · #3 (**permalink**) Jan 19th, 2006, 17:48

Wow! thanks so much. I figured there was some key line like that that i was missing. ^_______^

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
multiple rollover images change multiple images	joshlindem	Web Page Design	4	Apr 18th, 2008 09:11
Using layers in CSS	jwalker80	Web Page Design	3	Dec 21st, 2005 14:08
Layers	chris123	Web Page Design	3	Jun 1st, 2005 07:52
Centering layers in a page	gwx03	Web Page Design	9	Nov 26th, 2003 19:55

		Webforumz.com > Main Forums > Design Your Website > Web Page Design
Centering multiple layers