Menu
In javascript I need to show div content on the center of the browser window; Content of the window is high therefore it has a scroll.
How can I set up div element on the center of the screen independently of the scroll ?
Thanks!
464
You can do this by setting the display property to “flex.” Then define the align-items and justify-content property to “center.” This will tell the browser to center the flex item (the div within the div) vertically and horizontally.
To horizontally center a block element (like <div>), use margin: auto; Setting the width of the element will prevent it from stretching out to the edges of its container.
Use a container element and set a specific max-width . A common width many websites use is 960px. To actually center the page, add margin: auto .
You can use this CSS (You don't need javascript for that):
#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 make the div pretty with additional CSS.
173
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
