Forum Replies Created
-
Posts
-
Screenshot Desktop: https://innobit.ch/wp-content/uploads/2018/02/Breadcrumb_Desktop.png
Screenshot Mobile 1: https://innobit.ch//wp-content/uploads/2018/02/Breadcrumb_Mobile-2.jpg
Screenshot Mobile 2: https://innobit.ch/wp-content/uploads/2018/02/Breadcrumb_Mobile-1.jpgHi Jordan,
i have just put in the code for sticky header and sticky breadcrumb, both mobile and desktop, referring to the code posted on 24th of November.This is what you get:
desktop:
mobile_1:
mobile_2:
Problem:
The code effects an overlapping of the easy slider by the sticky breadcrumb/header code. Without code there is a clean 100% visible slider but therefor no sticky breadcrumb:Do the screenshots help you for now?
Thanks a lot for your help.
Best, TimoHi Jordan,
i have tried Victorias Code from above and removed all of ours before.
Unfortunately i am still confronted with the same issue: As soon as header and breacrumb bar both get sticky, they are overlapping the Easy Slider at top of every page. As desktop view the easy slider is still partially visible. On mobile devices, the slider is entirely overlapped by menu bar und breadcrumb bar.Do you have any suggestion how to fix this problem?
Really urgent!Thanks again,
TimoHi Jordan,
i put the login credentials in the private content box above.
Thanks for your help in advance.Best regards
TimoHi Jordan,
there is a bunch of other css code in there but nothing really adressing the header…so i dont know exactly where the problem is.
The only thing i’ve added in the header area is this code:
/*** HEAD ***/
.logo{width:190px;}
.logo a img {margin-top:15px;}/*** LOGO ADJUST ***/
@media only screen and (max-width: 1070px) {
.responsive #top .av_mobile_menu_tablet .av-main-nav .menu-item-avia-special {
display: block !important;
}
.responsive #top .av_mobile_menu_tablet .av-main-nav .menu-item {
display: none;
}
.responsive #top .av_mobile_menu_tablet .av-main-nav .menu-item-avia-special a { border: none !important; }
}/*** LOGO ADJUST SUPPORT ***/
@media only screen and (max-width:635px) and (min-width: 480px) {
.logo img {
max-width: 30%!important;
}}How do i proceed the best way? Because your solution isnt working so far.
I really need to get the header und breadcrumb sticky, both mobile and desktop, without overlaying any top page content.Thanks a lot for your help
TimoHi Victoria,
thanks for your advice.
This is how i added the code – unfortunately it didn’t fix the problem. The sticky header and sticky breadcrumg are still overlaying title and slider area on top of the page…An other suggestions?
Thanks a lot for your help!
Best, Timo/**MOBIL STICKY HEADER**/
.html_header_top.html_header_sticky #header {
position: fixed !important;
}
@media only screen and (max-width: 767px) {
.responsive #main {
padding-top: 0px !important;
}
}/** BREADCRUMB STICKY **/
.title_container {
position: fixed;
width: 100%;
z-index: 99;
}
@media only screen and (max-width: 767px){
.responsive #top #main .container_wrap:first-child {
border-top: none;
margin-top: 80px;
}
}
#main {
padding-top: 90px !important;
}Hey Marissaconniff,
thanks a lot. This is exactly what i was lokking for. Works perfectly fine!
Best regards,
TmoThanks Yigit
