Archived topic
Limit logo width/height
6 replies · Started by Warner on August 28, 2018
Hi,
I'm trying to implement the basics with GP Premium and I'm a bit stuck.
I have created a 'merged' header (by creating a 'Header Element') and I want to limit the width of the site logo. Preferably I would not upload a smaller version of the logo, because if I make it any smaller it will become very unsharp.
I know that using SVG will solve the sharpness issue, but also in that case I want to control the height/width of the logo.
Please help :)))
Hi there,
you can use this CSS to resize the logo:
.site-logo {
width: 300px;
}
/* Mobile size and to center it in the header - adjust accordingly */
@media (max-width: 768px) {
.site-logo {
width: 200px;
}
.inside-header {
text-align: center;
}
}
Hi!
Ok that great, thanks!
Actually, it seems I need to max-width everywhere (since the sticky header logo gets deformed otherwise).
Also, I don't seem to manage to 'override' with
@media (max-width)... </blockquote>
so I used
@media (min-width: 1025px) {
.site-logo {
max-width: 325px;
}
.inside-header {
text-align: left;
}
}
/* Mobile size and to center it in the header - adjust accordingly */
@media (max-width: 1024px) {
.site-logo {
max-width: 300px;
}
.inside-header {
text-align: left;
}
}
One more question: how do I now move the menu button on the mobile version to the right of the logo? For now it's stuck right under the logo, where it's taking up precious space ;)
Thanks again!
Sorry.. one more thing (after that I'll leave you alone..)
The layout in Mobile seems to be having some problems (that don't show up in the preview):
1. Sticky Header had the first 10 or so pixels cut of in Chrome/Android
- when it first appears when scrolling down
- when it is sticking to the top when scrolling up
- (when scrolling down it is shown correctly)
- (in firefox for mobile it is shown correctly)
2. The general layout seems to be a few pixels too wide (in Chrome/Android and Firefox/Android). So I can scroll a few pixels to the right..
Are there solutions for these issues that you know of?
Thanks!
Any chance you can open separate topics for different questions?
It will help us to keep track of the issues.
Thanks!
Hi again,
during the morning hours in Europe (when you were sound asleep I hope) I solved most of the issues.
Thanks for your help!
No problem :)