Archived topic
Navigation alignment
6 replies · Started by Jurjen Brouwer on June 17, 2018
I used the navigation logo (static) and with menuheight of 150 px the logo so in the right height.
But what i really would like to do is to place the logo in this position (so the word photography just above the photo) and to have the navigation in the same height as the word "photography"
Is that possible ?
This is the css I used:
.footer-widgets {
text-align: center;
}
.site-header {
display: none;
}
.main-navigation .site-logo.navigation-logo {
position: absolute;
left: 0;
top: 0;
}
.main-navigation .site-logo.navigation-logo img {
height: auto;
}
.main-navigation .main-nav > ul > li > a {
letter-spacing: 6px;
}
Thanks, Jurjen
Interesting - any chance you can set up the regular site logo instead of the navigation logo? Then set the navigation to float right and let me know. We should be able to set up some CSS.
Done…..
So, now I would like the j of Tjik to be overlapping the picture and the navigation to be on the same height as the word photography.
Is it possible ?
something like : https://tjikphotography.nl/wp-content/uploads/2018/06/generate.jpg
Try something like this:
.inside-header {
display: flex;
align-items: flex-end;
}
#site-navigation {
margin-right: 0;
padding-bottom: 15px;
}
.site-logo {
position: relative;
bottom: -60px;
}Depending on the browser support you need, you may need to run that code through this tool: https://autoprefixer.github.io/
Thanks Tom ! This was exactly what I was looking for !!
I will buy you a cup of coffee ……
Jurjen
Thank you so much! Appreciate it :)
