hamburger disappears from navbar component when switch to container?

Bootstrap Studio Help
1

Using standard Navbar component <br> With the fluid ticked the hamburger appears at phone size but when i tick it off, it disappears.

How can I have a non-fluid container yet still have the hamburger at phone size?

thanks

2

I had tested this out on a new project. Since you are saying non-fluid I dragged a container component to the project and then the navbar.

Whether I had the container component or not at no time did I lose the hamburger menu. Even when ticking/unticking the fluid option for either the outer container that I added or the inner container that is included with the navbar component. With neither ticked/both ticked or one or the other ticked no difference.

<*body>
    <div class="container">
        <nav class="navbar navbar-default">
            <div class="container-fluid">
                <div class="navbar-header">
                    <*a href="#" class="navbar-brand navbar-link">Brand<*/a>
                    <*button data-toggle="collapse" data-target="#navcol-1" class="navbar-toggle collapsed">
                        <*span class="sr-only">Toggle navigation<*/span>
                        <*span class="icon-bar"><*/span>
                        <*span class="icon-bar"><*/span>
                        <*span class="icon-bar"><*/span>
                    <*/button>
                </div>
                <div class="collapse navbar-collapse" id="navcol-1">
                    <*ul class="nav navbar-nav">
                        <*li role="presentation" class="active">
                            <*a href="#">First Item<*/a>
                        <*/li>
                        <*li role="presentation">
                            <*a href="#">Second Item<*/a>
                        <*/li>
                        <*li role="presentation">
                            <*a href="#">Third Item<*/a>
                        <*/li>
                    <*/ul>
                </div>
            </div>
        </nav>
    </div>
<*/body>

I would have to think that you probably have some other CSS that is actually affecting the margin/padding or possibly the width of the navbar that hamburger gets pushed off the side of the screen is what I'm thinking is happening. Unfortunately, I don't know your code etc... to actually determine what's happening.

Saj

3

Thanks Saj

Not sure what happened but it did prompt me to find a workaround using media queries. Anyway I learned more about using the program.

Tried it again now just by dragging a new navbar on a new doc and it works.