当父容器元素具有溢出滚动时，这是否可以使子 dom 元素具有可见的溢出？

Question

I have a modal component which should have scrollable content.

On that modal component I have a datepicker input, which should popup a datepicker and this popup should be visible even when it is outside of the container component block.

Is this possible to make datepicker component to have visible overflow when the parent has overflow: scroll?

I have tried to use position: absolute but this doesn't help for my case

Answer 1

You can use position absolute

But you have to remain careful while positioning because position: absolute is not positioned wrt to parent element in this scenario. You can use another container for box1 and position it relative

 .box1 { width: 100px; height: 200px; border: 1px solid black; overflow: scroll; } .box2 { width: 200px; height: 100px; border: 1px solid black; position: absolute; }

 <div class="box1">Heknasdfsdfffffffffff <div class="box2"></div> </div>