roligeroald
-
Posts
4 -
Joined
-
Last visited
Content Type
Forums
Gallery
Blogs
Events
Store
Downloads
Profiles
Posts posted by roligeroald
-
-
19 minutes ago, tuanphan said:
To center logo, you need to change vertical-align: center to background-position: center;
Hi Tuan,
Thanks for answering - that makes it look right on mobile/smaller devices, but also moves the logo on larger screens, and i would prefer if it looked the same as the other pages.
So mobile is fine:
But web is wrong:
It should stay the same as :
What can i do to achieve this?
Kind regards,
Roald
-
Thanks for answering! Hm.. No, unfortunately, that didn't do it. Should I use media query?
I don't know enough about this to see what (if anything) interacts, but I have two bits of css relating to the logo and title - both in the custom css, and in the advanced page header code injection for the specific page.
From custom css:
/* Display both logo and site title in header */
.header-title-logo a:after {
content: "Leirbålet lydproduksjon";
display: block;
font-family: 'YomogiRegular';
font-size: 25px;
text-align: center;
vertical-align: center;
font-weight:900;
padding-top: 5px;
}
.header-title-logo img {
vertical-align: left;
}
and <style>
.header-title-logo img {
visibility: hidden;
}
.header-title-logo a {
background-image: url("https://static1.squarespace.com/static/624bf2c0638f3073bec82e2b/t/62f516d2a502dd6bdb5cfaee/1660229330500/logo+lyse+glor_or.png");
background-size: contain;
background-repeat: no-repeat;
vertical-align: center;
}
.header-title-logo a:after {
color: #F4F5F1;
}
</style>Any other ideas?
Kind regards,
Roald
-
Site URL: http://leirbaaletlyd.no
Hello everyone,
I'm quite new to this; I have been working on my website for a couple of weeks.
I've managed to glean from the forums here how to display both logo and title for my site header, and have been quite happy with my design (still undecided on the color scheme, though). However, when I added a dark photograph to the top of my homepage, I saw that I needed to add a different logo to that particular page. I've managed to do something of the sort by adding css styling to the advanced-section of that page (also from what I've read here), but now the logo only displays at top left screen, regardless of screen size - whereas all other pages has logo and title left for web, and logo above title centered for mobile, which is what I prefer.
Here's what the other pages look like:
And here's the troublesome mobile one:
and the working web-version:
Website at http://www.leirbaaletlyd.no
Pw: BaaletsKnitren
Any help would be much appreciated!
Kind regards,
Roald
Different logo and title placement for web and mobile
in Customize with code
Posted
Hi again Tuan,
Thanks - that fixed it! Much appreciated!
Kind regards, Roald