html5shiv not working in IE8?
Move HTML5Shiv’s script
element to head
section, before all other style
and script
elements.
Bootstrap 3 Not Working in IE8
You need to change this:
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->
To something like this (using whatever is the relative path for your site):
<!--[if lt IE 9]>
<script src="/path/to/your/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="/path/to/your/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->
HTML5shiv does not work properly on IE8
From the images, This seems to be a Browser specific Problem and NOT an HTML5shiv Problem.
Please check which Document Mode
Your IE8 is running in. If it is IE8 then its some other error.
If it's something else than IE8 please add this meta
tag as the first element of the <head>
Tag.
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
Bootstrap 3 with respond.js and html5shiv.js still not working on IE8
Okay so the non-responsive css file wasn't exactly what we were looking for. However, we found the problem:
IE8 doesn't seem to like the @import-property.
We used a global css file which imported the necessary styles. When moving all stylesheets to the header and including them with a normal link-tag, it works.
It's weird though, the regular bootstrap styling (buttons, backgrounds and such) got imported properly. The grid system was not. I guess Internet Explorer works in mysterious and retarded ways.
Why aren’t my HTML5 tags being styled in IE8 when I’ve applied HTML5 shiv?
Depending on your security settings, Internet Explorer will not execute JavaScript in local files. An exception are files with a Mark of the Web.
You can change this behavior with the following setting:
If Internet Explorer has even more strict settings, it may not allow JavaScript on any web site. If that is the case, you can enable JavaScript in Internet Explorer with these instructions.
Related Topics
Using 'Box-Sizing: Border-Box' with 'Inline-Block' Elements
Aligning Text and Select Boxes to The Same Width in CSS
How to Center Text Inputs Using Materialize CSS
Border Collapse Differences in Ff and Webkit
Animate Radial-Gradient CSS3: Move from Left to Right
CSS Layout That Fills Available Space
Rails 4: How to Identify and Format Links, Hashtags and Mentions in Model Attributes
Z-Index Not Working on Pseudo-Element
Bootstrap: Horizontal Fields Inside Vertical Form
Video Player Shows Black Border
Input[Type=Select] Doesn't Work for Me
Fit <Svg> to The Size of <Object> Container
How to Start New Row of CSS Table Cells Without a Row Wrapper Element
Center Div Vertically in Flexbox Container with Stretch Alignment
Vertical Rule (As Opposed to <Hr>) in CSS
Stacking Divs with Variable Height in 2 Columns Like Facebook Timeline
How to Vertically Align Two or More (Side by Side) Elements in a Div