Hi @dinalee80,
Your Hamilton child theme includes some additional styling for the button element, including setting its left property to 24px. This results in the navigation toggle, which is a button element, to overlap with the site title. You’ll have to remove that property from the button element in your child theme.
— Anders
Thank you so much Anders! I went into the child theme and CTRL-F to find the button element. I found that the left property was set to 24px in addition to the top so i went ahead and set them both to 0px and after saving, it looks like the issue still exists. Could it be anything else?
This is the button code i edited:
button {
opacity: 0.6;
background-color: transparent;
position: fixed;
z-index: 2;
top: 0px;
left: 0px;
border: none;
width: 36px;
height: 30px;
outline: none;
transition: opacity 0.2s ease-out;
&:before {
content: “”;
@include position-center;
right: auto;
width: 100%;
background: linear-gradient(
to bottom,
$color, $color 20%,
transparent 20%, transparent 40%,
$color 40%, $color 60%,
transparent 60%, transparent 80%,
$color 80%, $color 100%
);
transition: opacity 0.2s ease-out,
width 0.2s 0.2s ease-out;
@dinalee80 You need to remove the left property altogether – setting it to 0 will just set the navigation toggle further to the left.
Wow! You are amazing – Thank you for your help, it worked!
