gaffnere

you hero!

thanks so much! it’s perfect. amazing ??

ok to be honest, little bit of confusion. i wasn’t sure where you wanted me to add that code. think it’s in the order you meant now. complete code below.

#header {
  position: relative;
  padding-bottom: 30px;
 }

 #access {
  background: none;
 }

 #access,
 #access .nav-show,
 #access a.nav-show:hover {
  bottom: 0;
 }

 #access .nav-show,
 #access a.nav-show:hover {
  top: initial;
  left: 44%;
 }

 #access:target .menu {
  margin-top: 0;
 }

#access,
#social-media-icons {
 position: relative;
}

#access .nav-show {
 bottom: -38px;
}

}

nav box still doing little jump when you click it, & then overlaps with “contact” link. otherwise it’s all working fine.

thank you again.

seriously, thank you so much for your help, andrew. really appreciate it.

so i added your latest code to my custom css & left in

#access {
  background: none;
 }

what happens now:
on the initial load, the nav box is positioned great with no overlapping. but when you click on it, the nav box jumps to it’s previous position overlapping the twitter icon. when you click again, it takes you straight to the contact pg. although it doesn’t overlap with the “contact” part of nav anymore.

no worries if we can’t solve it. i can always revert to how it was in the start. frustrating that we’re getting so close tho!

oh just noticed as well –
now when you click into the nav, the nav box overlaps with the “contact” link & brings you straight to the contact page, even though you haven’t clicked on it.

thank you so much for your response, andrew! wish i understood all of this a little more..

so i tried what you suggested & am pleased to report the icons now work. however, the nav is overlapping the twitter (middle) icon a bit. is there any way i could lower it a bit to remove the overlap & maybe slightly centre it better (width-ways).

willfredd.roisingaffney.com

forever grateful!

hi again,
i should probably add that i am also using the following custom css to move the search bar on the mobile site as it was overlapping with the nav menu… although i don’t think it’s affecting this issue at all.

#header input#s {
    z-index: auto;
}

.flex-direction-nav, .flex-pauseplay {
    z-index: auto;
}

hi guys,
same issue…
i tried your solution andrew & the nav did move for me. but now the 3 social media icons aren’t working. (they worked fine when the nav was in the original place.)
site is: willfredd.roisingaffney.com
any ideas? i don’t particularly mind where the nav box is positioned, i just don’t want it overlapping the site’s logo.
thanks!