Width based media queries are based on the entire browser window. If the browser window is narrower than 800px, do this. If the browser is window is wider than 400px, do this. But that’s not always enough. Imagine a desktop 3-column layout at 1000px. Each column is 333px wide. Then you have a media query break at 800px which drops it to a 2-column layout, and with the third below. Even though the browser is now narrower, each column is wider (400px). It would be easier to write media queries for the modules inside those columns based on the current width of the column, not the browser window.
Kumail Hunaid’s project can help with that. I like the approach. It adds class names to elements that you then use to style, so it’s pretty unobtrusive.
