CSS Frontendcore CSS setup

First of all before do this you need to compile the scss into css, and of course remember to replace %PATH% for your case.

1. Add the meta viewport to the head

With the combination of this meta and the grids of frontendcore your site will be responsive without a great effort.

<meta name="viewport" content="width=device-width, initial-scale=1.0" />

2. Link the main.css

The main.css is the most important file for your styles, include the link in the head of your page.

<link rel="stylesheet" type="text/css"  href="%PATH%/main.css" media="all">

3. Add Css fixes for IE9

IE9 has some very specific issues with the css that are solved by this css, just add it to the head after the main css and between conditionals.

<!--[if gte IE 9]>
	<link rel="stylesheet" type="text/css"  href="%PATH%/ie-new.css" media="all">
<![endif]-->

4. Add Css fixes & Javascript polyfills for IE8 (optional)

IE8 has no support for html5 tags, so you will need some javascript polyfills to make it work... and of course several css fixes. Just add them to the head after the main css and between conditionals.

<!-- Css and JS for IE8 or below including a little script that notifies about old browser -->
<!--[if lte IE 8]>
<script src="js/ie-old.js"></script>
<link rel="stylesheet" type="text/css"  href="css/ie-old.css" media="all">
<script type="text/javascript">
	var $buoop = {reminder: 0};
	$buoop.ol = window.onload;
	window.onload=function(){
		try {if ($buoop.ol) $buoop.ol();}catch (e) {}
		var e = document.createElement("script");
		e.setAttribute("type", "text/javascript");
		e.setAttribute("src", "//browser-update.org/update.js");
		document.body.appendChild(e);
	}
	</script>
<![endif]-->
Setup the Javascript