Chris
Chris

Reputation: 1037

CSS for div spanning from specific point to edge of window

I have an HTML div positioned at a certain point (position: absolute; top: ...; left: ...). How do I make the div span from that point over to the edge of the page, and scale as the window is resized? I.e. - the same behavior as for width: 100%, but with the top left corner of the div at a specific, arbitrary point.

Upvotes: 2

Views: 620

Answers (2)

Jørgen
Jørgen

Reputation: 9130

If the element is absolutely positioned, you can assign it's top, left, bottom and right properties:

   <html>
    <head>
        <style>
            #foo{
                position: absolute;
                top: 10px;
                left: 10px;
                bottom: 0;
                right: 0;
                background-color: red;
                border: 5px solid blue;
            }
        </style>
    </head>
    <body>
        <div id="foo"></div>
    </body>
    </html>

Upvotes: 2

Chris Lang
Chris Lang

Reputation: 43

if i understand the question correctly, this should work

div {
    position: absolute; 
    left: 100px; << "left top corner of the div at a specific, arbitrary point."
    top: 0;
    bottom: 0;
    right: 0; 
    background-color: #666;
}

Upvotes: 2

Related Questions