I need to place a div
(with position:absolute;
) element in the center of my window. But I am having problems doing so, because the width is unknown.
I tried this. But it needs to be adjusted as the width is responsive.
.center { left: 50%; bottom: 5px; }
How can I do it?
To center an element both vertically and horizontally: position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; But if you would like to understand how I came to these solutions, read further for more explanation.
This works for me:
#content { position: absolute; left: 0; right: 0; margin-left: auto; margin-right: auto; width: 100px; /* Need a specific value to work */ }
<body> <div> <div id="content"> I'm the content </div> </div> </body>
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