How to stretch a nested block to the full width of the page?

Question

HTML

There is

<div class="block1">
  <div class="block2">
  </div>
</div>

How to stretch block 2 to the entire width of the page, regardless of the properties of block 1?
I tried using the script to set the width equal to body and the negative left indent equal to offset().left of block 2, but when resizing, the indent changes haphazardly.

Answer 1

It seems to have worked.
codepen.io/anon/pen/ZbRrwy

Answer 2

Try this:
jsfiddle.net/pgcjsk7j/2

Answer 3

I think that during resizing it can change due to features in browsers, or you need to make a script so that it constantly checks the size during resizing, try resizing and updating the browser, if it worked out, then everything seems to be normal.