-
Hi!
I need a little help with my sticky header. It looks perfect on the desktop versions of Chrome and Firefox (and I believe Edge). However, it isn’t correct in Safari and mobile/tablet views. I have attached an image of what I am seeing (the full header height isn’t backed in white and the logo isn’t lining up with the navigation menu the same way). I am hoping I can get it to be consistent across platforms.I have added this .css to get it where I like it (when viewed with Chrome or Firefox desktop versions). Perhaps I made a mistake?
#header-inner.nav-type-1 #logo {
padding-top: 40px !important;
padding-left: 50px !important;
}
.main-navigation {
margin-top: 60px;
padding-right: 50px;
}
#header-inner.nav-type-1 {
padding-bottom: 100px !important; }Because the navigation menu and logo were not able to line up at all on mobile views I added this css:
@media handheld, only screen and (max-width: 1200px){
#main-nav {
display: none!important;
}
}
@media handheld, only screen and (max-width: 1200px){
#show-nav-menu {
display: inline-block;
}
}I’m not sure if that was the correct or best route – but it did clean it up a little. I’d like to have the navigation bar menu, but I just couldn’t get it to work without it dropping the navigation menu bar “down a line”.
I hope this makes sense.
Here’s my siteThank you!
Traci
-
HB-Themes support team typically replies to all topics within 48 hours except on weekends and public holidays. You must register to post topics.
Forum Categories
- Highend WP Theme 25,510
- Aegaeus WP Theme 1,616
- Requests and Feedback 133