question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Meterial subnav bar invisible

See original GitHub issue

This is a (multiple allowed):

  • bug
  • enhancement
  • feature-discussion (RFC)
  • Framework7 Version: 1.4.2.
  • Platform and Target: chrome v52 firefox v42.

What you did

<div class="navbar">
      <div class="navbar-inner">
             <div class="left">
                   <a href="/" class="link icon-only back">
                        <i class="icon-arrow-left"></i>
                     </a>
             </div>
            <div class="center">Center</div>
            <div class="subnavbar">
                <form class="searchbar " action="/Search" >
                    <div class="searchbar-input">
                                <input type="search" placeholder="keyword" >
                      </div>
                  </form>
            </div>
      </div>
</div>   
<div class="page-content with-subnavbar hide-navbar-on-scroll">
<!-- other code -->
</div>

Expected Behavior

sub nav bar shows up

Actual Behavior

sub navbar is hidden

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Comments:9 (3 by maintainers)

github_iconTop GitHub Comments

2reactions
thiagojedicommented, Mar 23, 2017

I think I found the “bug”. The “navbar-inner” class contains a “overflow: hidden;” rule. toolbars.less line 26

After I put “overflow: visible” in my code it worked.

Is this the right behavior?

0reactions
nolimits4webcommented, Mar 6, 2018

Issue is closed because of outdated/irrelevant/not actual/needed more information/inactivity.

If this issue is still actual and reproducible for latest version of Framework7, please create new issue and fill the issue template correctly:

  • Clearly describe the issue including steps to reproduce when it is a bug.
  • Make sure you fill in the earliest version that you know has the issue.
  • Provide live link or JSFiddle/Codepen or website with issue
Read more comments on GitHub >

github_iconTop Results From Across the Web

NavigationView bar material invisible on iOS 15 - Stack Overflow
On iOS 15, an app with a NavigationView with .inline mode no longer shows the blurry material color you would see for the...
Read more >
How to make Bootstrap Navbar transparent - code helpers
Creating a transparent navbar is very easy - just dont add a color class ... In this case, the Navbar will take the...
Read more >
How to Create Transparent Drop Down Navigation Menu with ...
How to Create an HTML Dropdown Menu | Learn HTML and CSS | HTML Tutorial | HTML for Beginners · Responsive Navigation Menu...
Read more >
Navigation bar – Material Design 3
Navigation bars offer a persistent and convenient way to switch between primary destinations in an app. They're a common navigation component on handheld ......
Read more >
Angular Material Navbar with Toolbar Show Hide Option
In here i am going to explain how to create the angular material toolbar and navbar component and how to control the visibility...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found