0

I am using bootstrap, and the default for mobile navigation is 768px. I want to expand this to 979px instead? I have search and try anything for hours but with no luck at all. Can someone help me with this problem?

<nav class="navbar navbar-default navbar-fixed-top">
    <div class="container-fluid">
        <div class="row">
            <div class="col-lg-12">
                <div class="col-md-4" style="background-color:coral;">
                    <div id="divLogo" class="pull-left">
                        <img src="~/Images/logo.png" />
                    </div>
                </div>
                <div class="col-lg-8" style="background-color:crimson;">
                    <div id="divMenuRight">
                        <div class="navbar">
                            <button type="button" class="navbar-toggle btn btn-navbar-highlight btn-large btn-primary" data-toggle="collapse" data-target=".navbar-collapse">
                                NAVIGATION <span class="icon-chevron-down icon-white"></span>
                            </button>

                            <div class="navbar-collapse collapse">
                                <ul class="nav nav-pills ddmenu">
                                    <li class="active">@Html.ActionLink("Home", "Index", "Home")</li>

                                    <li class="dropdown">
                                        <a href="#" data-toggle="dropdown" class="dropdown-toggle">Transport <b class="caret"></b></a>
                                        <ul class="dropdown-menu">
                                            <li>@Html.ActionLink("Medicin", "Medicin", "Home")</li>
                                            <li>@Html.ActionLink("Køl / Varme / Frost", "Temperaturkontrolleret", "Home")</li>
                                            <li>@Html.ActionLink("ADR", "ADR", "Home")</li>
                                            <li>@Html.ActionLink("Express", "Express", "Home")</li>
                                            <li>@Html.ActionLink("Flytninger", "Flytninger", "Home")</li>
                                            <li>@Html.ActionLink("SLV", "SLV", "Home")</li>
                                            <li>@Html.ActionLink("Dyr", "Dyr", "Home")</li>
                                            <li>@Html.ActionLink("Håndvåben", "Weapons", "Home")</li>
                                            <li>@Html.ActionLink("England Tur/Retur", "TurRetur", "Home")</li>
                                        </ul>
                                    </li>

                                    <li>@Html.ActionLink("Priser", "Priser", "Home")</li>
                                    <li>@Html.ActionLink("Nyheder", "Nyheder", "Home")</li>
                                    <li>@Html.ActionLink("Kontakt", "Kontakt", "Home")</li>
                                    <li>@Html.ActionLink("Job", "Vognmand", "Home")</li>
                                    <li>
                                        <a class="hideButtonDk" href="@Url.Action("Change", "Home", new { Lang = "da"})">
                                            <img src="@Url.Content("~/Images/icon_uk.png")" />
                                        </a>
                                    </li>
                                </ul>

                            </div>

                        </div>
                    </div>
                </div>
        </div>
    </div>
</div>
    </nav>
tinaw25
  • 183
  • 2
  • 4
  • 14
  • Possible duplicate of [Twitter bootstrap 3 how to activate navbar-collapse on small devices](http://stackoverflow.com/questions/23347701/twitter-bootstrap-3-how-to-activate-navbar-collapse-on-small-devices) – max Mar 08 '16 at 20:43

1 Answers1

1

You will need to download a custom build of bootstrap from their site and update the default in the "Media queries breakpoints" section.

Update the width for the "screen-sm" variable from 768px to the desired value.

http://getbootstrap.com/customize/enter image description here

CountZero
  • 6,171
  • 3
  • 46
  • 59