I found the solution, but will check this thread and take advice if you have any to offer, thanks
Hey all, I found your forum through a google search while looking for help on my project.
I'm more of a server side coder, so my CSS is rusty at best, and I seem to be having problems. Here's the situation:
I needed to have a ~15% opaque 'content box', I did this by using a .png background image. I was just going to make a 1px image and repeat it along the y axis to go easy on loading times, but an image with a height of 1000px was only 6.62kb, besides if I did it that way I could keep my shadowed borders.
Aside from that this seems to be the only way it has come close to properly working. I was considering making a ~5px image to put at the top of the <div> to cover the shadow for the top and top edges, then a 1px repeating background to shave some loading time, but either way I still don't think it will work with the code I have currently.
My structure is as such ( View Here:
http://www.dreamlab.nu/r3ign ):
Body > Wrapper > Logo + Nav + Content Box > Content Box Modules
The Content Box is the ~15% opaque box, and it will not size properly when I place content inside of it. When I set the Content Box height to 100% it extends ridiculously far. If you've followed the link I posted above, the height on the content box is currently set to 30%.
If you need files you should be able to access them all via my above working directory (
http://www.dreamlab.nu/r3ign ).
Images in /images
global.css in main directory
index.php in main directory
Thank you for your help in advance, I'm sorry for the length of my post, but I tend to over explain everything.
EDIT: Also I added position:absolute; to the Content Box because it wouldn't budge past ~5px height unless it was being filled with text only. Perhaps I'm not using the function properly.
EDIT2: After reading w3s's article on CSS positioning, I am indeed using the function incorrectly, since no parent has a position, it is referring to the HTML tag, and will extend forever. I am unsure of how to fix this, and the problem still stands.
EDIT3: After more in depth reading at w3schools, I discovered position: relative; it seems to work properly now. It's amazing how simple something is when you step back from it for a second. Either way, if you have any suggestions on my code, or see something that's a no-no, please feel free to post, I'm always looking for tips.
Before you post, read our: 
