If we spend any time working with media queries, there are some limitations we need to consider; these apply equally if we were writing using Less or plain CSS:
Not every browser supports media features uniformly; to see the differences, visit http://cssmediaqueries.com/overview.html using different browsers.
Current thinking is that a range of breakpoints has to be provided; this can result in a lot of duplication and a constant battle to keep up with numerous different screen sizes!
The
@media
keyword is not supported in IE8 or below; you will need to use JavaScript or jQuery to achieve the same result, or a library such as Modernizr to provide a graceful fallback option.Writing media queries will tie your design to a specific display size; this increases the risk of duplication as you might want the same element to appear in multiple breakpoints, but have to write individual rules to cover each breakpoint.