Midway.js makes it super easy to automatically center the responsive elements on your websites. You all know and love the absolute positioning centering technique, but what happens when those centered elements change sizes, due to percentage based layouts? That's where Midway.js comes in. Take a look at the example below, and see for yourself!

See a live example.

Download & Usage

Midway.js is super lightweight, one file that's not even 1KB! Download below to get started.

Download on GitHub

Download Midway.js using the link above, and place it in the root directory of your site. Then place the following right before </head>

<script type="text/javascript" src="midway.min.js"></script>

Depending on if you want your element to be centered horizontally, vertically, or both, add the following classes.

<div class="centerHorizontal centerVertical"></div>

That's it! See, super easy to use!


Midway.js was made by Brandon Jacoby, and the rest of the team at Shipp Co. It was created with hopes of making it easier for people to create responsive websites. Feel free to get in touch on Twitter with any questions or concerns.