2016-07-22 7 views
0

ich eine harte Zeit habe, warum das Symbol Mobil Menü herauszufinden, werden auf der folgenden Seite angezeigt werden:Mobil Menü Themen/Symbol nicht angezeigt

Sie werden sehen, wenn Sie auf eine kleinere Größe die Größe fest, dass in der oberen In der rechten Ecke befindet sich ein Link, der das mobile Menü aufruft. Das Bild, das sich dort zeigen soll, tut das aber nicht.

#nav-toggle { 
position: absolute; 
top: 0; 
right: 0; 
display: block; 
width: 54px; 
height: 44px; 
overflow: hidden; 
text-indent: -9999px; 
-webkit-user-select: none; 
background: url('http://www.cap-acp.org/_images/icon-res-menu.png') center center no-repeat; } 

    @media screen and (min-width: 767px) { 
.js #nav { 
    position: relative; 
} 
.js #nav.closed { 
    max-height: none; 
} 
#nav-toggle { 
    display: none; 
} 
} 

Antwort

2

Ihr Bild ist ein transparentes .png mit nur weißen Balken, so dass es da ist, aber Sie können es vor einem weißen Hintergrund nicht sehen. Sie können dies überprüfen, indem Sie Ihrer Hintergrund-CSS-Deklaration eine Hintergrundfarbe hinzufügen, z. B .:

+1

Danke, das hat den Trick! – user1110562

0

Josh hat Recht. Wenn Sie das Bild ändern, sollte es gut angezeigt werden.

#nav-toggle { 
    position: absolute; 
    top: 0; 
    right: 0; 
    display: block; 
    width: 54px; 
    height: 44px; 
    overflow: hidden; 
    text-indent: -9999px; 
    -webkit-user-select: none; 

    /* I changed the background src to a different hamburger and it works fine */ 
    background: url('https://www.elavon.com/images/icon-mobile-menu-off.svg') center center no-repeat; 
} 

@media screen and (min-width: 767px) { 
    .js #nav { 
    position: relative; 
    } 
    .js #nav.closed { 
    max-height: none; 
    } 
    #nav-toggle { 
    display: none; 
    } 
}