-
Posts
-
I have figured out how to get my subtext on 2 lines with subtext below logo (see https://gatehealing.com/). I know this will work when I get it to the right of logo as well.
BUT, when I use the documentation code for Subtext on Right, My name stacks like this:
Jonathan F.
Anderson,
LPC-sThen my company (which should be the separate line under my name) is stacked like this:
Gate
Healing,
PLLCWhat is good is that the subtext is where I want it in relation to the logo . . . just a few pixels to the right of the logo.
When I use the Custom Size Logo code, I get the subtext on 2 lines like I want it, but it’s pushed over to the middle of my header–it looks like it is just extending the logo area to the right, and pushing my subtext (here’s the custom logo size code I tried):
#top .logo ,
#top .logo a {
width: 300px;
}
@media only screen and (max-width: 767px) {
#top .logo ,
#top .logo a {
max-width: 60% !important;
width: 60% !important;
height: auto;
}}I am sure my answer is a mixture of not using the custom logo size and using the custom logo size, but I cannot figure it out exactly what to do . . .
Thanks for help.
PS I have put this specific question in a new thread (this one) since it is referenced in other threads that don’t directly relate to it.
I have basically figured it out on laptop/desktop by adding Width (also adjusted translate(xxx%, -50%) to the following code, but on mobile devices, it pushes it way over to the right. I will leave it as is for now so you can see it at https://gatehealing.com/
.logo .subtext {
position: absolute;
top: 50%;
right: 0;
width: 275px;
transform: translate(105%, -50%);
z-index: 999;Jon
Now I have subtext on 2 lines on my iphone 7, but burger menu is so close to the clickable subtext that you have to click below the burger menu to access menu, or else you get the logo subtext url that just takes you back to home page.
There must be a workaround, like not showing logo on mobile, or putting subtext below logo on mobile?
JFor now, until I can get just the logo hidden only on mobile, and subtext hidden only on tablet, I have hidden the entire logo area with this (I changed max-width to 1030px):
/* Hide logo in mobile*/
@media only screen and (max-width: 1030px) {
#main .av-logo-container {
display: block;
}
#header .logo,
#main .logo {
display: none!important;
}}I will continue to play with the code to try and figure out how to:
1) Hide only the logo on mobile devices (because the burger menu prevents subtext from overlapping anything)
2) Hide only the subtext on tablets (because tablets don’t have the burger menu, so the written items do overlap the subtext)Any help is much appreciated.
Hi gatehealing,
https://cl.ly/d23704dd4336 I see the logo is hidden, can you please have all those visible, so that we can try to adjust it for you. Can you disable caching and minification for now?
Best regards,
VictoriaHi Victoria ,
Autoptimize is deactivated and Caching is disabled. Logo and subtext are now visible.
J
PS My users cannot access the burger menu while I have those visible, at least on my iphone7. Bigger phones may not have the problem, but I want to be sure folks with older phones can access the menu easily.
Thanks again!
J
- You must be logged in to reply to this topic.