Could somebody amazing please help me? |
Could somebody amazing please help me? |
Leah Payne |
May 30 2012, 09:09 PM
Post
#1
|
Group: Members Posts: 1 Joined: 30-May 12 Member No.: 17,199 |
I am so frustrated.
I am trying to build a simple site to sell crafts made by kids. I designed an image in photoshop for our background (a lemonade stand), and I would like to create a transparent scroll box inside the window of the lemonade stand to feature the images of the crafts. I finally figured out how to get my image to take up the entire browser no matter how big it was, but I can't figure out how to put my content in a fixed location - one that also shrinks when people view from a different browser/window size. my website: ourlittlelemonadestand.com This is the code I have: I use dream weaver, but I didn't use a template for this site because I couldn't get all of the sidebars/headers/body/footers/etc to not be a huge mess. CODE <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <img src="http://ourlittlelemonadestand.com/newlemonade.gif" alt="background" id="bg" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Our Little Lemonade Stand</title> <style type="text/css"> img#bg { width:100%; height:100%; } div#content { width: 100%; height: 100%; } #content { position: relative; top: -30em; z-index: 1; width: 100%; height: 100%; } body { } </style> </head> <body> <div id="content"> I need my content in the window of the stand, not here. :( </div> </body> </html> Please help |
Darin McGrew |
May 31 2012, 01:46 AM
Post
#2
|
WDG Member Group: Root Admin Posts: 8,365 Joined: 4-August 06 From: Mountain View, CA Member No.: 3 |
I think a better approach would be to build the lemonade stand as a variation of the custom border/corners design described here:
http://www.alistapart.com/articles/customcorners/ That would adapt to various sizes of browser window without the headaches of positioning content on top of a background that is being rescaled in various unpredictable ways. |
Lo-Fi Version | Time is now: 29th March 2024 - 02:30 AM |