Invalid CSS rendering of sidebar menu in IE8
I tried to fix this error in my view for IE8. Sorry if this question has been asked many times before, but I still can't seem to resolve it.
This is my plunker: example
When I run this plunker in IE8, the menu is hidden by default.
If you want to see Full Screen View in IE
This is a design of a real system running in IE8, there is extra space that shouldn't be between the menu and the content.
As you can see the image:
- A I have extra space that shouldn't be there
- B My add-ins only appear to be correctly aligned in firefox
- C I was able to fix the selection using the directive found here kkurni.blogspot.com.au posted by kkurni
To fix Angular.js issue I tried this code:
<!DOCTYPE html>
<html xmlns:ng="http://angularjs.org" id="ng-app" ng-app="yeomanTutAngApp">
<head>
<!--[if lte IE 8]>
<script>
document.createElement('ng-view');
</script>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
</head>
</html>
<!--[if lt IE 9]>
<script src="bower_components/es5-shim/es5-shim.js"></script>
<script src="bower_components/json3/lib/json3.min.js"></script>
<![endif]-->
<div class="row">
<div class="col-xs-4">
<div class="input-group">
<input class="form-control input-sm" type="text" ng-model="selected" id= "mySearch"
typeahead="word for word in getAutocomplete($viewValue)"
typeahead- `loading`="loadingClientsPreview">
<i ng-show="loadingClientsPreview" class="glyphicon glyphicon-refresh"></i>
<span class="glyphicon glyphicon-remove input-group-addon" ng-click="selected = ''"></span></div>
</div>
</div>
C. My selection shows data, but it looks too small. (Fixed)
<div class="form-group">
<p class="col-xs-3 ">{{'Language'|translate}}</p>
<select ng-model="people.language"
ng-options="value.code as value.name | translate for value in languages">
</select>
</div>
+3
source to share