The Lodge is members-only design/dev videos and Office Hours.

Next Office Hours Session: "Implementing an SVG Icon System" Nov 30 - 6:00 PM Eastern

Give child div width:100% of page width, inside parent.

  • # April 27, 2009 at 10:06 pm

    How do I do this?

    Here’s the reference page:

    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.


    # April 28, 2009 at 12:54 am


    Absolute Positioning will probably be the easiest way to do it. Here is what I would do:

    .tiltviewer {

    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.

    Make sense?
    Ashton Sanders

    # April 28, 2009 at 1:31 am

    That makes sense. I’ll try it and see how it goes.

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed