5

I have an issue with my navbar on bootstrap 3. When adding an iframe onto the page it won't expand and I cannot navigate (on small screens). Maximizing the window (big screens) however shows, that the navbar is there and all items are available and clickable.

Without the iframe, everything works as expected. Can anyone imagine, why? This seems rather strange to me...

I'd appreciate any pointers.

Cheers :-)

Edit: Some code. Don't get confused by the django code fragements inside the html. They are working fine.

Edit2: I also noticed now my footer isn't showing on that same page containing the iframe. commenting out the iframe and everything works. Why would that be? Noone?

iframe:

<div class="col-md-4">                                                              
  <iframe frameBorder="0", width="100%", height="500", id=generic src="generic_order.html"/>                                                                                          
</div>

navbar:

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="index.html">Camerata Serena</a>
        </div>

        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse navbar-ex1-collapse">
            <ul class="nav navbar-nav navbar-right">
                {% for page in page_list %}
                    {% if page.titel != 'Kasse' %}
                        <li><a href="generic_page.html?index={{ page.page_index }}">{{ page.titel }}</a></li>
                    {% endif %}
                {% endfor %} 
                <li><a href="admin/">Intern</a></li>                    
            </ul>
        </div>
        <!-- /.navbar-collapse -->
    </div>
    <!-- /.container -->
</nav>
EvilSmurf
  • 819
  • 1
  • 7
  • 21
  • Questions seeking debugging help ("why isn't this code working?") must include the desired behavior, a specific problem or error and the shortest code necessary to reproduce it in the question itself. Questions without a clear problem statement are not useful to other readers. See: [How to create a Minimal, Complete, and Verifiable example](http://stackoverflow.com/help/mcve). – Aibrean Sep 16 '14 at 12:41
  • Thank you for your suggestion. I added the specific code section causing the problem, which is just an iframe. The issue however has nothing to do with that and concerns the navbar of bootstrap which definition I also added. Thanks again – EvilSmurf Sep 16 '14 at 13:14

1 Answers1

8

I found the issue.

One has to use

<div class="col-md-4">                                                              
  <iframe frameBorder="0", width="100%", height="500", id=generic src="generic_order.html"></iframe>                                                                                          
</div>

with the complete closing statement. It's not enough to use

<div class="col-md-4">                                                              
  <iframe frameBorder="0", width="100%", height="500", id=generic src="generic_order.html"/>                                                                                          
</div>
EvilSmurf
  • 819
  • 1
  • 7
  • 21