Navigation Clean Issue

Bootstrap Studio Help
1

I've converted an old CMS website to use bootstrap 4, at some point I am going to move the entire site to a new CMS, but it involves moving thousands of articles, reviews and tutorials over. In any case I built a bootstrap 4 layout that will work with the old CMS, I use the navigation clean component for navigation (see http://designertoday.com). the collapsible menu for small screens works perfectly in preview, however when I move everything to the production website the mobile menu will open briefly then collapse again.

I've troubleshot this issue till i turned literally blue figuring it out. Any advice or insight would be greatly appreciated.

On a side note I am loving Bootstrap Studio 4, it's exactly what I have been looking for (review forthcoming on Designer Today magazine).

2

I don't know asp, but do you have something looking for the click of the navbars button to reload the current page? Because that's what is happening when you click it, the page reloads.

I don't see any script set to do that which is why I'm asking if you have something configured in your asp setup or whatever.

Saj

3

I change out of mobile view, clicked Articles and then back into mobile view. Click hamburger menu and reloads the page then I reloaded the page and got a dialog window stating:

Confirm For Resubmission The page that you're looking for used information that you entered. Returning to that page might cause any action you took to be repeated. Do you want to continue? Continue and Cancel buttons.

Ok, so this seems to be a resolution.

Add the attribute type="button" to the button because it's behaving like a submit button.

Saj

4

I will have a look and see what's going on with the "click" and see if that helps.

5

By goodness the type="button" attribute did the trick. Kudos!

6

Glad I could help :)

Saj

7

I appreciate it. Sometimes a second set of eyes helps. Thanks again.

Allen

8

I'd also suggest trying this added CSS, it should get your Brand and hamburger menu to layout on the same line as opposed to stacking. Which is what I see in screen sizes that would be considered smaller than my iPhone7 such as an iPhone 5/SE.

@media (max-width:374px) {
    .navigation-clean {
        padding-left:0;
        padding-right:0;
    }
}

It's optional, just thought I'd share it. :)

Saj

9

Thanks! I might give it a try later. I'm elbows deep redesigning another website I own at the moment.