title: Sticky child div relative to parent div horizontal scroll
body: <p>I am having some issues with child div sticky inside the parent div. Parent div having two child divs. child2 height is going beyond the height of parent div. So I have added the scroll for parent div. Now the problem is I want to make the child 1 div as sticky, when i Make the child 1 as sticky the width of this div is going out of the parent div. The child1 should go inside the parent div and able to scroll the parent div horizontally.</p>
  
  <pre><code>.parent {
    width:250px;
    height:250px;
    background-color:#CCCCCC;
    position:relative;
    overflow:scroll;
  }
  
  .child1 {
    width:500px;
    height:50px;
    background-color:#4285F4;
    position:fixed;
  
  }
  .child2 {
    height:500px;
    width: 600px;
  
  }
  
  &lt;div class="parent"&gt;
     &lt;div class="child1"&gt;&lt;/div&gt;
      &lt;div class="child2"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Any help would be deeply appreciated.</p>
  
  <p><strong>Update</strong>
  the exact problem is, when i give width for child2 as 500px, I am able to scroll horizontally. But child1 is moving out of the parent div and the content is displaying.</p>