Глификоны в Bootstrap 3 не работают

Я знаю, что этот вопрос задавался ранее, но не могу найти ничего конкретного о том, как решить мою проблему.

Я делал предыдущий проект MVC, где иконки глифов работают просто отлично.

Я в другом проекте, где он не работает. Тем не менее, этот проект, который я перенял у кого-то другого, является проектом веб-форм. Я взглянул на исходный код и теги span для значков, но они не отображаются на кнопках. Также кажется, что все на месте.

Значки для глифов присутствуют в каталоге шрифтов.

Может кто-нибудь, пожалуйста, дайте мне знать, что я могу упустить?

Изменить: размещение кода, где глифы не отображаются.

Вот код для двух кнопок: "Стоп" и "Наказание".

<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>

Вот скриншот двух кнопок, которые не показывают глифы:

Edit # 2 - кнопки с Firefox

Вы можете видеть на первом изображении с IE. На втором изображении вы можете видеть, что значки глифов пытаются появиться в Firefox, но только пустые квадраты.

Вот код главной страницы, насколько все ссылки идут...

<!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>
Источник

2 ответа

Я думаю, что вам не хватает ссылки на / шрифты, вы также пытались протестировать ее в другом проводнике?

Источник

При загрузке начальной загрузки вы также должны были загрузить папку с именем шрифты. Вы, должно быть, упускаете это, потому что именно это решило проблему с моей страницей. Папка "шрифты" должна находиться в главном каталоге вашей страницы. Я надеюсь, что это решит вашу проблему.

Источник
Другие вопросы по тегам