Nail your responsive layouts with this device cheat sheet

Ensure your layouts scale across devices and resolutions with this handy reference.

Shares

No-one ever said that responsive web design was easy, but there's plenty that you can do to smooth out the process. If you can go into a responsive project without having to worry about the size of your grids then that'll save you at least one headache along the way.

Here is a quick breakdown of the standard measurements you can use across devices, depending on the width you choose to make the columns. Remember, the column widths should remain the same across device sizes, but you can adjust the initial width to fit your needs. I'll typically design a mobile website at 360px wide to work in this system.