<div id="container">
<div id="inner"></div>
</div>
<script src="scripts.js"></script>
body {
/* Full screen width and height */
width: 100%;
min-height: 100vh;
/* Centers the container in the middle of the screen */
display: flex;
justify-content: center;
align-items: center;
margin: 0;
background-color: rgb(220, 220, 220);
}
#container {
perspective: 40px;
}
#inner {
width: 20em;
height: 18em;
background-color: white;
box-shadow: 2px 2px 50px rgba(0, 0, 0, 0.2);
}
(function(){
// Init
var container = document.getElementById('container'),
inner = document.getElementById('inner');
})();
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.