Archived topic
Mobile header size
5 replies · Started by Diana on March 18, 2018
Hi there,
I'm wondering how I can make my header appear centered and bigger on a mobile device (basically I want it to look the same as it does on a desktop). Right now when I view my site on mobile, the header appears very tiny in the upper left-hand corner and aligned with the menu. Is there a way to change this?
Thank you!
Hi there,
Disabling the mobile header should work: https://docs.generatepress.com/article/mobile-header/
Thanks! I did this and it brought the header where I wanted it but the size was still very small. I changed the padding around the header and it now looks pretty good in mobile but the header size is huge on desktop view. Way too big. Is there a way to fix the sizing?
I would suggest setting the padding to what you want on desktop in the customizer:
https://docs.generatepress.com/article/header-padding/
Then change it for mobile using CSS:
@media (max-width: 768px) {
.inside-header {
padding: 10px 10px 10px 10px;
}
}
Adding CSS: https://docs.generatepress.com/article/adding-css/
Wonderful, it worked! Thank you!
No problem!