Post/Page Titles hidden when viewing on smaller screens
Angela
I've tried numerous times to make this post, but the forum keeps deleting it from this theme for some reason. I'm going to try making this post again one more time before I consult the support gurus of the forums for help.
Good day to you all,
I’m worried I might be making this more complicated than it needs to be. To preface my issue, this is what my post’s header looks like on a computer screen.
This is perfect. I’m happy with the way this looks.
However, when I load the same post on a phone, the title of the post gets hidden under the logo.
Generally, I would shrug this off since it doesn’t look terrible. But then, when it comes to posts/pages with longer titles, such as the one below, the titles stick out from under the logo.
Viewed on Computer Screen (This is perfect!):
Viewed on Phone Screen (This is NOT perfect – see the title sticking out from under the logo):
The Problem: Instead of stacking under the logo when the screen size shrinks, the titles of my pages/posts are getting hidden on the layer below the logo.
*To ensure I’m being crystal clear on what I’m trying to accomplish, I made this doodle to demonstrate:
Attempts at a Solution:
Commonly, when I want something to stack on a mobile device, there’s a switch in the theme called, “Stack on Mobile” that I can toggle on and off. I searched for such a toggle for the page/post titles under every menu imaginable under “Dashboard => Customize” and “Edit Page => Document.” I could find no such thing (although, this could be because I’m sleep deprived.)
Then, I decided to go digging through the CSS in the theme to see if I could get the logo to shrink into the top left corner of the screen on a mobile device in the hopes it would reveal the page/post title below. No matter what I put into the style sheet, nothing changed. Some other style sheet must have been overriding my edits. This probably wasn’t the best solution anyway, so I won’t bother to post my attempts at editing the CSS here.
Finally, I tried editing the div class on the page/post title. However, I went through every CSS folder in the theme and could not find the class of the title anywhere.
According to my web inspector, the div class is section-title-wrapper. Why is it non-existent in any of the CSS folders?
I’m not sure what else to try. At this point, I’m hoping one of you will reply with something along the lines of, “You silly person, you just had to press this super obvious button here!” :’)
