Show pure css popup when page loads - html

Question

I wanted to show pure css popup when page load. I cannot use any JavaScript also I cannot use any ( checkbox and radio buttons ) elements.
I have found some help from http://netdna.webdesignerdepot.com/uploads7/creating-a-modal-window-with-html5-and-css3/demo.html and http://www.cssscript.com/demo/minimal-overlay-modal-pure-css/
But here the popup shows after user click on a button or element. But I wanted to show the popup when page loads.
Any solutions ?

Answer 1

* {
padding: 0;
margin: 0;
}
body {
position: relative;
}
input {
display: none;
}
input:checked + label {
position: fixed;
left: 0;
top: 0;
width: 100vw;
height: 100vh;
background-color: rgba(0, 0, 0, .6);
}
input:not(:checked) + label {
display: none;
}
.m-window {
background-color: white;
padding: 2em;
display: inline-block;
border-radius: 4px;
box-shadow: 0 0 10px rgba(0, 0, 0, .8);
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
<input type="checkbox" checked id="modal">
<label for="modal">
<div class="m-window">
click me!
</div>
</label>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse felis est, cursus sed pulvinar ac, facilisis sed est. Mauris eget tortor luctus, congue ante ut, ultrices arcu. Vivamus suscipit nisi eget est facilisis, at tincidunt dui pretium. Etiam
dolor orci, condimentum a neque ut, hendrerit aliquam lectus. Nulla efficitur lectus risus, in ullamcorper mi porta sit amet. Sed risus mauris, maximus vitae dignissim a, vulputate a diam. Sed efficitur viverra leo, ac mollis risus laoreet nec. Nam
semper eleifend mattis. Aliquam erat volutpat. Ut sagittis imperdiet lorem quis mollis. Phasellus interdum nulla sed fringilla posuere. Nullam molestie mi vel ligula interdum placerat. Ut ac condimentum nunc. Aenean eleifend at nisl in posuere. Etiam
eget aliquam velit. Vivamus pulvinar lacinia urna id iaculis. Pellentesque porttitor neque a ipsum malesuada rutrum. Cras accumsan felis eu metus eleifend, nec venenatis ipsum ullamcorper. Cras non massa purus. Sed urna leo, iaculis vel tincidunt vel,
laoreet eu tellus. Ut porta orci at ex lacinia pellentesque. Aenean eu pulvinar erat, eu fermentum risus. Morbi ipsum nisi, vestibulum et ante sed, semper sollicitudin erat. Nam eu lorem a neque vulputate semper. Pellentesque eu purus dignissim, consequat
elit ut, gravida mi. Suspendisse lobortis sodales lacus sit amet condimentum. Fusce porta est non condimentum dictum. Duis vel volutpat lectus, ut auctor augue. Pellentesque neque diam, euismod nec nulla eu, dapibus consectetur diam. Donec maximus lectus
sit amet quam dignissim, et commodo enim commodo. Suspendisse laoreet rhoncus orci, eu fringilla massa aliquet a. Curabitur consequat, purus id porttitor finibus, magna odio bibendum elit, nec interdum dolor magna eget ligula. In ultrices interdum bibendum.
Praesent ultrices ultricies tellus vitae pellentesque. Vivamus arcu justo, dignissim sit amet orci non, faucibus sollicitudin ligula. Morbi laoreet vestibulum risus nec posuere.
</p>