title: DIV 100% width of grandparent while grandparent's width is not 100% viewport
body: <p>I've found some solutions here but all of them assume that grandparent has 100vw which is not in my case.</p>
  
  <p>Here is what I do want to achieve:</p>
  
  <pre><code>&lt;body&gt;
      &lt;div id="grandparent" style="width: 1000px"&gt;
          &lt;div id="parent" style="width: 500px"&gt;
              &lt;div id="child" style="width: grandparent"&gt;&lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>Actually I need to align child's width with 5th level grandparent's width. If it is absolutely impossible with pure CSS then I would thank for JS solution.</p>
  
  <p>But CSS is preferable.</p>