I know this question has been asked before, but can't find anything specific on how to solve my issue.
I did a previous MVC project where the glyph icons are working just fine.
I'm in another project where it's not working. However, this project I'm taking over from somebody else is a web forms project. I took a look at the source code and the span tags are there for the icons, but they don't show up on the buttons. It also seems that everything is in place.
The icons for the glyphs are present in the fonts directory.
Can someone please let me know what I might be missing?
Edit: Posting code where glyphicons don't show up.
Here is the code for the two buttons, "Stop" & "Penalize".
<div class="col-md-4">
<button class="btn btn-primary" id="btnStop"><span class="glyphicon glyphicon-stop"></span>Stop</button>
<button class="btn btn-warning" id="btnPenalize"><span class="glyphicon glyphicon-exclamation-sign"></span>Penalize</button>
</div>
Here is the screenshot of the two buttons which don't show the glyphicons:
Edit #2 - Buttons with Firefox
You can see in the first image is with IE. In the second image you can see that the glyph icons try to appear in Firefox, but just empty squares.
Here is the masterpage code as far as all the links go...
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="description" content="" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title></title>
<link href="../Content/lib/assets/css/bootstrap.min.css" rel="stylesheet" />
<link href="../Content/lib/assets/css/datepicker.css" rel="stylesheet" />
<link href="../Content/assets/css/font-awesome.min.css" rel="stylesheet" />
<link href="../Content/assets/css/ace-fonts.css" rel="stylesheet" />
<link href="../Content/assets/css/ace.min.css" rel="stylesheet" />
<link href="../Content/assets/css/ace-skins.min.css" rel="stylesheet" />
<link href="../Content/assets/css/ace-rtl.min.css" rel="stylesheet" />
<link href="../Content/bootstrap-switch/bootstrap2/bootstrap-switch.min.css" rel="stylesheet" />
<%--<link href="../Content/lib/assets/css/styling-02.css" rel="stylesheet" />--%>
<link rel="Stylesheet" type="text/css" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />
<%--<link href="../Content/lib/assets/css/ui.jqgrid.css" rel="stylesheet" />--%>
<link rel="../content/lib/assets/css/ace-skins.min.css" />
<link rel="../content/lib/assets/css/ace-rtl.min.css" />
<link href="../Content/lib/assets/css/js-css-menu.css" rel="stylesheet" />
<link href="../Content/lib/assets/css/js-css-menu.min.css" rel="stylesheet" />
<!-- page specific plugin styles -->
<link rel="stylesheet" href="../Content/assets/css/jquery-ui.min.css" />
<link rel="stylesheet" href="../Content/assets/css/datepicker.css" />
<link rel="stylesheet" href="../Content/assets/css/ui.jqgrid.css" />
<style type="text/css">
.auto-style3
{
left: 0px;
top: 7px;
}
</style>
<%-- main page styling --%>
<link href="../Content/ryder/css/ryder.css" rel="stylesheet" />
<script src="../Scripts/jquery-2.1.0.min.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.3/jquery-ui.min.js"></script>
<script src="../Scripts/knockout-3.1.0.debug.js"></script>
<script src="../Content/lib/assets/js/bootstrap.min.js"></script>
<script src="../Content/lib/assets/js/bootbox3/bootbox.min.js"></script>
<script src="../Scripts/modernizr-2.6.2.min.js"></script>
<script src="../Scripts/ryder/scripts.js"></script>
<script src="../Scripts/ryder/hidden-navs.js"></script>
<script src="../Scripts/ryder/telerik-controls.js"></script>
<script src="../Scripts/grid.locale-en.min.js"></script>
<script src="../Content/assets/js/ace-extra.min.js"></script>
<%--<script src="Scripts/jquery.jqGrid.min.js"></script>--%>
<script src="../Content/lib/assets/js/jquery.jqGrid.min.js"></script>
<script src="../Scripts/json2.min.js"></script>
<script src="../Content/lib/assets/js/bootstrap-datepicker.min.js"></script>
<script src="../Scripts/Common.js"></script>
<script src="../Scripts/DataServices/StopPenalize.js"></script>
<script src="../Scripts/DataServices/CreditSourceDocs.js"></script>
I think you are missing the link to /fonts, also have you tried testing it in antoher explorer?