How to position the Dialog box to center of page on scrolling?
Open a dialog on the center of the screen and maintain the center positioning on scrolling the page that have large content.
Consider a web page with large content to be scrolled, a dialog appears on the visible area at the moment which gets hidden on scrolling the content. That is the dialog position will remain same as when it is opened so that it can’t be viewed in visible area on scrolling. To resolve this behavior and make the dialog to be viewed on the screen even on scrolling, set the dialog control wrapper CSS position as fixed and mention the top value. This will make the dialog to be shown in center of screen on scrolling the content of the web page. Refer the following code sample.