Как заставить переключатель navbar слева от Бренда в начальной загрузке 3.3.7 - PullRequest
Новая
       5

Как заставить переключатель navbar слева от Бренда в начальной загрузке 3.3.7

0 голосов
/ 28 июня 2018

У меня пока есть следующий шаблон: 

     <!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <title>Welcome</title>
</head>
<body>
    <nav class="navbar navbar-inverse navbar-fixed-top">
        <div class="container-fluid">
               <div class='navbar-header'>
                    <button type='button' class='navbar-toggle' data-toggle='collapse' data-target='.navbar-collapse'>
                        <span class='sr-only'>Toggle navigation</span>
                        <span class='icon-bar'></span>
                        <span class='icon-bar'></span>
                        <span class='icon-bar'></span>
                        <span class='icon-bar'></span>
                        <span class='icon-bar'></span>
                    </button>
                    <a class='navbar-brand' href=""><img src="images/Evaluate_Pharma_Logo_220.png" /></a>
                </div>
                <div class="clear-fix"></div>
                <div class="navbar-collapse collapse">
                    <ul class='nav navbar-nav'>
                        <li>
                            <a href="">
                                <input type="text" /><span class="fa fa-search big"> </span> SEARCH
                            </a>
                        </li>
                        <li>
                            <a href="">
                                <span class=""></span>BROWSE DATA
                            </a>
                        </li>
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
                                CREATE REPORT
                                <span class="caret"></span>
                            </a>
                            <ul class="dropdown-menu">
                                <li><a href="" rel="Company & Country Profiles">Company &amp; Country Profiles</a></li>
                            </ul>
                        </li>
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
                                PEER GROUPS
                                <span class="caret"></span>
                            </a>
                            <ul class="dropdown-menu"></ul>
                        </li>
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
                                YOUR EVALUATION
                                <span class="caret"></span>
                            </a>
                            <ul class="dropdown-menu"></ul>
                        </li>
                    </ul>
                </div>


            </div>
    </nav>
</body>
</html>

Когда я запускаю это, я получаю свое меню, как и ожидалось, но когда я уменьшаю ширину страницы, мой класс переключателей навигационной панели появляется справа от торговой марки navbar. Мне нужно, чтобы это было слева от этого, как я могу это сделать? Это всего лишь оболочка, я знаю, что мне нужно заполнить мои hrefs и другие вещи

1 Ответ

0 голосов
/ 28 июня 2018

bootstrap плавает правильно, поэтому вы можете переопределить его с помощью: 

.navbar-toggle {
  float: left !important;
}

примечание: использование "Важно" не рекомендуется, поэтому альтернативно добавьте новый селектор идентификатора к тому же элементу кнопки, что и .navbar-toggle, и добавьте то же свойство и значение.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...