Archived topic
align header-widget text to the bottom of the header, overlap background image
5 replies · Started by sparkle on June 1, 2020
Viewing posts 1–6 of 6
i would like to align my header-widget text to the bottom of the header, and overlap background image across the navigation bar. i've tried css options including z-index and flex-end, but nothing seems to be working for me.
hope you are all well!
Hi there,
do you have a mockup image of what you're trying to achieve?
i was hoping for something like this https://imgur.com/a/MqVAPtJ
Try adding this CSS:
@media (min-width: 769px) {
.site-header {
margin-bottom: -100px;
}
.inside-header {
display: flex;
}
.header-widget {
order: 10;
margin-left: auto;
align-self: flex-end;
}
}You will need to increase the Headers Top and Bottom to around 100px each for the overlap to work.
YES! thank you so much! that looks awesome! thank you! be well!
Glad to hear that and glad to be of help !
This archived topic is closed to new replies.
