Javascript center div on page enable scrolling

Question

In javascript, I need to show the contents of a div in the center of the browser window; The contents of the window are large, so it has a scroll.

How to adjust div element in the center of the screen regardless of scrolling?

Thanks!

Answer 1

You can use this CSS (you don't need javascript for this):

#divID{ width:500px; /* adjust */ height:500px; /* adjust */ top:50%; left:50%; margin-left: -250px; /* half of the width */ margin-top: -250px; /* half of the height */ position:fixed; } 

You can watch the demo here, including scrolling.

You can make a div look nice with extra CSS.

Check out the demo

Answer 2

You want a CSS property, not JS. What you need to do to scroll this: overflow:scroll; . Add this to the CSS used in the field.