Looking for the v1 documentation? You can find it here.
Setting up your HTML
Inside the zip file you will also find a HTML file containing the default template for including
responsive in your webpage.
Set up your layout as follows.
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="description" content="Your Page Description." /> <title>Your Page Title</title> <!-- IE10 Mobile ignores the meta viewport tag. This fix needs to be in the head. --> <script src="responsive.ie10mobilefix.min.js"></script> <link href="responsive.min.css" rel="stylesheet" /> <!-- HTML5 Shiv and Respond.js IE8 support of HTML5 elements and media queries WARNING: Respond.js doesn't work if you view the page via file:// --> <!--[if lt IE 9 &!(IEMobile)]> <script src="vendor/html5shiv.min.js"></script> <script src="vendor/respond.min.js"></script> <![endif]--> </head> <body> Your Body Content <!-- Scripts at the bottom for improved performance. --> <!-- jQuery, required for all responsive plugins. --> <!--[if IE 8]> <script src="vendor/jquery-1.11.0.min.js"></script> <![endif]--> <!--[if gt IE 8]><!--> <script src="vendor/jquery-2.1.0.min.js"></script> <!--<![endif]--> <script src="responsive.min.js"></script> </body> </html>
Responsive is built to work best in the latest desktop and mobile browsers. Everything though has been built with progressive enhancement in mind, meaning older browsers might display differently styled, though fully functional, renderings of certain components.
Specifically, latest versions of the following browsers are supported:
- Chrome (Mac, Windows, iOS, and Android)
- Internet Explorer
- Firefox (Mac, Windows)
- Opera (Mac, Windows)
- Safari (Mac and iOS only, as the Windows version is being abandoned)
Internet Explorer 10 Mobile
- Matt Stow: Responsive Design in IE10 on Windows Phone 8
- Tim Kadlec: Windows Phone 8 and Device-Width
Internet Explorer 8
Internet Explorer 8 is also supported, however, please be aware that some CSS3 properties and HTML5 elements are not fully supported by this browser. In addition, Internet Explorer 8 requires the use of html5shiv to correctly display those elements and Respond.js to enable media query support.