0

For a page that have layout made by only flexboxes, I would like to create an overlay on top of one of the flexboxes without interfering with other elements already in place

  <div class="row">
    <div class= content-left> </div>
    <div class= content-right>
        <div class="abs-overlay" > something something </div>
    </div>
  </div>

the absolute overlay, using 100% width and 100% height, however stretch beyond the parent box. as seen in the image. Is there a CSS way to let absolute overlay fit inside flex parent?

Here is the link to the test page http://sample-page-site.s3-website-ap-southeast-1.amazonaws.com/

There are some related questions on SoF but I don't think It directly solve my problem.

Asons
  • 84,923
  • 12
  • 110
  • 165
qkhanhpro
  • 4,371
  • 2
  • 33
  • 45
  • 1
    Yes, give parent `position: relative` – Asons May 03 '19 at 11:25
  • Provide your code, so that we can understand your problem. You can turn the div with class="content-right" to a flex-container (display:flex) and add flex-items inside it – Meziane May 03 '19 at 11:56

0 Answers0