CODEWITHSUNDEEP
responsive-design
Jordan
Jordan

Reputation: 1

Responsive navigation menu bug

Hey Guys,

I have an issue whenever viewed on mobile device, the navigation is hidden behind my banner.

http://ofek.rldstrategic.com/

/*--- mobile landscape style ---*/
@media only screen and (max-width: 767px) {
body .container{ max-width: 420px; }
body .body-wrapper.gdlr-boxed-style { max-width: 460px; }
body .body-wrapper{ overflow: hidden; }

.one-ninth, .one-eighth, .one-seventh,.one-fifth,
.two-fifth, .three-fifth, .four-fifth,
.one, .two, .three, .four, .five, .six, .seven,
.eight, .nine, .ten, .eleven, .twelve{ width: 100%; }   

<ul id="menu-home_short" class="dl-menu gdlr-main-mobile-menu dl-menuopen">
<li id="menu-item-5388" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-3733 current_page_item menu-item-5388"><a href="http://ofek.rldstrategic.com/">Home</a>
</li>
<li id="menu-item-5389" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-5389"><a href="http://ofek.rldstrategic.com/about/">About</a>
</li>
<li id="menu-item-5392" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-5392"><a href="http://ofek.rldstrategic.com/our-services/">Expertise</a>
</li>
<li id="menu-item-5394" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-5394"><a href="http://ofek.rldstrategic.com/our-projects/">Projects</a>
</li>
<li id="menu-item-5390" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-5390"><a href="http://ofek.rldstrategic.com/consulting-services/">Consulting</a>
</li>
<li id="menu-item-5393" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-5393"><a href="http://ofek.rldstrategic.com/planning/">Planning</a>
</li>
<li id="menu-item-5396" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-5396"><a href="http://ofek.rldstrategic.com/auditing/">Auditing</a>
</li>
<li id="menu-item-5391" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-5391"><a href="http://ofek.rldstrategic.com/contact-page/">Contact</a>
</li>

Upvotes: 0

Views: 58

Answers (1)

Jacklck
Jacklck

Reputation: 53

depending on what kind of banner you're using, I would think by adding

z-index: -10;

to your banner, you'll get the navbar on top

Upvotes: 1

Related Questions