Archived topic
Longish tagline should wrap rather than interfere with widgets
5 replies · Started by nomind on December 8, 2020
On https://www.financialwisdomforum.org/ our tagline is "Where Canadian investors meet for financial education and empowerment". For branding reasons to connect to our discussion forum we have built a header that looks like the phpBB prosilver style, so the Search Widget is placed in the header.
One problem that some users have reported to us is if their screen size isn't particularly large, the tagline interferes with the search widget.
Is this a bug? Or is the some CSS we could add so the tagline wrapped rather than interfered?
Hi there,
Its one of the many nuances of the Flex Box CSS the theme is using. By default the Site Branding is set to fill the space available to it. Which in 99% of cases is whats required. In this case we need to switch it around with this CSS:
.site-header .site-branding-container {
flex-shrink: 1;
margin-right: 10px;
}
.site-branding-container .site-logo {
flex-shrink: 0;
}
Thank you. Tested it on my testing environment and it solves the issue. Deployed on production site.
Given there are no (apparent) limits on the length of a tagline, should this be fixed in the theme's code?
Marking it resolved.
Glad to hear that.
Tricky to implement that change as the default styles is what ensures any other content in the Header such as the Widget area is correctly aligned.
This is the first time we have seen this, so it looks like a niche case where custom CSS is best used. But we'll definitely take a look to see what can be improved.
Thanks again. We recently switched themes so are re-implementing some things as we learn the power and flexibility of GeneratePress.
Kudos to the support team who have been far superior to our previous theme's support. 👍👍
You're welcome - glad we can be of help!