Make div with absolute position expand and fill the rest of the page

Question

I have a div with absolute positioning, which serves as a kind of horizontal line, with a background image with x-repition. I want its width to fill up the whole page, but its x-position isn't 0 so I can't just give it width 100%. How do I do it?

Answer 1

I managed to solve it by nesting the div in another div which has left:0, with width:100% and overflow:hidden. Works perfectly =)

Answer 2

You can specify both left and right at the same time:

position: absolute;
left: 5px;
right: 5px; /* or whatever value you want */

Answer 3

I think you would have to use javascript to capture the width of the window. Then assign the width to the div.

    var winW = 630, winH = 460;

    if (parseInt(navigator.appVersion)>3) {
     if (navigator.appName=="Netscape") {
      winW = window.innerWidth;
      winH = window.innerHeight;
     }
     if (navigator.appName.indexOf("Microsoft")!=-1) {
      winW = document.body.offsetWidth;
      winH = document.body.offsetHeight;
     }
    }


  document.getElementById('divName').style.width = winW;
  document.getElementById('divName').style.height = winH;