I have fixed header on mobile device using script below (which I have found on the forum.
/**** FIX header in mobile ****/
@media (max-width: 768px) {
#wrapper {
padding-top: 18%;
}
#header {
position: fixed;
top: 0;
left: 0;
width: 100%;
margin: 0px;
background-color: #d8f0ed;
/*height: 11%;*/
}
}
In portrait view (vertical) it looks very nice (picture 1, iphone 6)
But when I turn device in horizontal (landscape) position the height of header is too big (picture 2, iphone 6)
Please help to optimize the height of header.
-
This reply was modified 2632 days ago by Slivkiss.
|
|
Hi,
You need to decrease the height of your site logo to be 50-60px maximum:
@media (max-width: 768px) {
#site_logo img {
max-height: 60px;
}
}
BR,
ThemeBurn team
|
|
Thanks. It helped a lot.
But how can I also decrease top and bottom margins?
|
|
Guys, any update?
How can I also decrease top and bottom margins?
|
|
Hi,
Please check the code in your first post in this topic. You need to replace the percent padding top of the wrapper with a fixed value, e.g. 80px:
padding-top: 80px;
BR,
ThemeBurn team
|
|
HI, I did like you wrote. The effect is the same that I had with padding-top: 18%;
But on iphone 5 I see the following picture (5s): the slicer goes under the header. This is one issue.
But actually my previous question was about the distance between top of header and buttons, and bottom of header and buttons. Please see the picture pic2.
Thank you in advance
|
|
You will need to register in order to post topics and read replies in the ThemeBurn.com support forums!
|
|
Unfortunately your code did not helped.
I have added the following code below code and received expected result.
#header {
position: fixed;
top: 0;
left: 0;
width: 100%;
margin: 0px;
padding-top: 16px; /*decrease space above logo and buttons*/
}
.tbLogoCol {
margin-bottom: -23px;/*decrease space under logo and buttons*/
}
|
|
Hi,
Please check the code from our previous post again. We’ve put !important to the CSS property to overwrite any other rules. It should work now.
https://nimbus.everhelper.me/client/notes/share/783523/29zwrvgocv69bwpf1lwp
BR,
ThemeBurn team
|
|
Glad we’ve helped
BR,
ThemeBurn team
|
|