Question

Je travaille sur la Topbar pour mon site Web à l'aide de la fondation, tout semble fonctionner correctement, à l'exception de l'icône du menu n'apparaît pas, j'ai suivi les documents de fondation et j'ai toujours des problèmes.Ce que j'ai ressemble à quelque chose comme ceci:

<header class="contain-to-grid">
<!-- Starting the Top-Bar -->
<nav class="top-bar" data-topbar>
        <ul class="title-area">
          <li class="name"/>

           <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
          <li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li>
        </ul>


    <section class="top-bar-section">

            <ul class="left">
                    <li class="divider"></li>
                <li >
                    <a href="#">page1</a>
                </li>
                    <li class="divider"></li>
                <li>
                    <a href="#">page2</a>
                </li>
                    <li class="divider"></li>
                <li >
                     <a href="#">page3</a>
                </li> 
                <li class="divider"></li>
            </ul>


            <!--Search in top bar-->
            <ul class="right">
                <li class="has-form">
                    <div class="row collapse">
                        <div>
                            <div class="large-8 small-8 columns">
                                <input type="text" placeholder="">
                            </div>
                            <div class="large-4 small-4 columns">
                                  <a href="#" class="button expand">Search</a>
                            </div>
                        </div>
                    </div>
            </ul>

    </section>

</nav>

<!-- End of Top-Bar -->
</header>

"MENU" apparaît et fonctionne correctement, mais l'icône du menu ne le fait jamais.Si je supprimais "Menu", rien n'apparaît et je ne peux pas utiliser le menu du tout.

Était-ce utile?

La solution

Je pense que je connais la solution.Vous devez importer la CSS de la fondation qui semble être la suivante:

<link rel="stylesheet" type="text/css" href="css/foundation.min.css">

Fondation Utilisez les requêtes de média.Cela signifie que vous devez redimensionnez le courant de votre navigateur à 40.063EM.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top