I want to make the child gallery div wider than it's parent div, and have a width of 100% of the browser window. The gallery is part of the wordpress content, so it must go in the container (entries) div. I want the gallery to fill the width of the screen, but 100% is relative to the container, not the page. If I do position:absolute; it makes the gallery large, but the left side is inside the container, and the rest of the gallery goes off the screen to the right, at 100% of the window width.
You may run into a problem with where the object is placed vertically. If it's always going to be the same, just do:
top: ##px; /* the number of pixels from the top of the screen that it will always be*/
Another problem is that since you are taking the object out of the page, content below it will move up behind it. You'll just need to put in a place holder to keep everything below it.
How do I do this?
Here's the reference page:
http://justinlowery.com/index.php/weddings-couples/
I want to make the child gallery div wider than it's parent div, and have a width of 100% of the browser window.
The gallery is part of the wordpress content, so it must go in the container (entries) div. I want the gallery to fill the width of the screen, but 100% is relative to the container, not the page. If I do position:absolute; it makes the gallery large, but the left side is inside the container, and the rest of the gallery goes off the screen to the right, at 100% of the window width.
Suggestions?
Absolute Positioning will probably be the easiest way to do it. Here is what I would do:
You may run into a problem with where the object is placed vertically. If it's always going to be the same, just do:
Another problem is that since you are taking the object out of the page, content below it will move up behind it. You'll just need to put in a place holder to keep everything below it.
Make sense?
Ashton Sanders