Skip to content
Get packs

Respond.js

A small script that makes min/max-width media queries work in old Internet Explorer versions.scottjehl/Respond

GitHub Download 1.4.2
Stars
11.2k
Forks
3.2k
Licence
MIT
Language
JavaScript
Last update
8.6 years ago
Type
Library

This repository is archived and no longer maintained.

What it is

Respond.js is a small JavaScript file that adds support for min-width and max-width CSS media queries to browsers that do not understand them, mainly Internet Explorer 8 and older. It lets a site use one responsive stylesheet, written mobile-first, and have the layout adapt to screen width in those older browsers. The project is archived, so it is no longer maintained.

  • Adding a 480px-and-up breakpoint to a stylesheet so older IE users see the wider layout
  • Running the script after all CSS so IE users see fewer flashes of unstyled layout
  • Calling respond.update() after adding a stylesheet dynamically so it gets translated

Great for

  • Developers maintaining legacy sites that must still render in Internet Explorer 8 and older
  • Teams who write mobile-first CSS and need a basic fallback for old IE
  • Projects that only use min-width and max-width media queries

Not ideal for

  • New projects, since the repository is archived and last changed in 2018 and modern browsers support media queries natively
  • Sites needing media query features beyond min/max-width, since the README says the script intentionally supports only those
  • Sites that serve CSS from a CDN or subdomain without setting up a local proxy, because the script re-requests CSS via AJAX and cross-domain requests fail

How to get it

  1. 1

    Download the app

    Clone the repository

    git clone https://github.com/scottjehl/Respond.git
  2. 2

    Run it

    • Write your CSS with min-width or max-width media queries, starting from mobile.
    • Include respond.min.js after all of your CSS in the page.
    • Serve the page from a web server, not from file://.
    • Open the page in Internet Explorer 8 or older to check the layout changes.
  3. 3

    Get the most out of it

    • Set far-future caching on CSS files so the script's re-request is served from browser cache, as the README recommends.
    • Use a local proxy for CSS served from a CDN or subdomain.
    • Concatenate stylesheets if you reference more than 32, to avoid an IE error.
    • Place @font-face rules outside media queries to avoid an IE7/IE8 hang.
    • Use respond.getEmValue() or respond.mediaQueriesSupported if you need them in your own code.

Downloads

Source code (.zip)master branch · straight from GitHubRelease 1.4.2Release notes and source

Strengths

  • Very small: the README states about 1kb minified and gzipped, with no other dependencies beyond an optional matchMedia polyfill
  • Designed to exit early in browsers that already support media queries
  • Simple usage: write standard media queries and include one script tag

Trade-offs

  • Narrow scope: only min-width and max-width queries are handled, and nested queries, @import CSS, and media queries inside style elements are not supported
  • Needs the server to return CSS with a 200 status, and it fails on file:// URLs
  • The project is archived and its last push was in March 2018

Stats synced from GitHub. The assessment above was drafted with AI from the project's README on 2026-10-29 and may miss recent changes — check the README before relying on a command. MIT licence: free to use, modify and distribute, including commercially, as long as you keep the copyright notice.