A web browser provides us an infinite canvas to create designs for websites. Usually we choose a specific portion of the browser to design our layouts to be compatible with different screen sizes and viewports. A 960px width grid with unlimited height will be the commonly used approach in web design. This means we are eliminating the possibility of using the space on the top, right, and left sides of our grid. impress.js provides the ability to position elements in a much wider range allowing us to grab the full potential of the browser window.
The amazing thing about impress.js is that we can even position elements in the 3D space using the z index. HTML data attributes are used to specify the positioning information of each step which we are calling slides. The positioning of elements can be done on the x, y, and z axis and we will be looking in depth into all the three directions in the following section.