Content not viewable due to page scroll

Context

We deal with a lot of data in our product. Mostly we design list views in such a way that when you click on any row in the list view you get to see the detail view on the right side of the list in the same screen. This had not caused problems until recently when our developers found an issue with this view.

Question

We have implemented page scroll only and always try to avoid inline scrolling. If we select a row which is a bit down in the list view and the page has been scrolled due to it then we are not able to see the detail panel on the right because that can only be viewed if we scroll back up.

Reference image attached below:

enter image description here

And if we scroll back to top, then we can see the detail of the selected row but now the selected row is not visible in the screen.

Reference image attached below:

enter image description here

How can we tackle this issue by keeping the same view?

We can always show the detail in some other screen or a modal dialog but that is not the point of it because we will always need parallel views in one or the other.