Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more
Hello fellow website enthousiasts!
I was wondering how i can move my header picture a little more up so my menu items dont blend in with the header picture i am using. I would like to have a codeline that i can play with to finetune this and make it so that the most of my picture is visible and that my menu items are clearly visible.
For clearity, i would like to have my menu items (black text) in front of the white background from the picture.
You can find a pictures of my header and my css code from it under this sentence.
The easiest way to achieve this would be to add background: white to the header menu.
If you navigate to Online Store, ... next to Customize, then Edit Code.
From there locate base.css and add background: white; to .header__inline-menu as shown below.
.header__inline-menu {
margin-left: -1.2rem;
grid-area: navigation;
display: none;
background: white;
}
Hope this helps
Simon
Hello Simon,
I hope this message finds u well. 🙂
Big thanks for trying to helpme out! I putted the code in base.css under everything but it doesnt give something. I dont think anything has changed at all.
I would like to push the picture a little bit up. If the top of the picture goes away, its ok. The most inportant thing is that the text should be readable.
If you know a code to put like a circle behin the icons, you can also share this one!
I have added a link with a picture for your information.
Kind regards,
Arne Stylemans - Arnosky.com