Header image to not float on mobile

This topic contains 5 replies, has 2 voices, and was last updated by  Sebastian 2 weeks, 2 days ago.

Author Posts

gserafy

I have a header image at http://www.obgynspecialistsfmacon.com and it floats on mobile – i.e. it stays fixed when a user scrolls on mobile – not sure if I like this, might keep it but would like to be able to play around with this to see what looks better. I took a screenshot of where I think that info is (if this issue is Microthemer and not the theme) but thought I would check with the expert first – here is the text of the screenshot…

@media (max-width: 480px)
.mobile-top-bar img {
position: fixed !important;
}
Thanks in advance.


Sebastian

Hey, I’m happy to take a look but I’m getting a site can’t be reached error for: http://www.obgynspecialistsmacon.com/

Could you check the URL?

Thanks,
Sebastian


gserafy

Apologies – https://obgynspecialistsofmacon.com/


Sebastian

Thanks, looking at your css stylesheet I can see that you’ve set position:fixed in Microthemer via the following selector:

General >> Mobile top bar image _2

Cheers,
Sebastian


gserafy

Thank you – I could only get it selected as Mobile top bar image _4 but when I do find it what do I change the CSS to?


Sebastian

Hey,

Previously created MT selectors are accessible from the selectors menu at the top left of Microthemer. If you’re getting _x (e.g. _2 or _4) when you target an element, it means you’ve already created one or more selectors for it. You should click the blue number when you hover over it, rather than a green plus, to return to a selector. The following getting started video explains this at the end:

I recommend you delete or disable the Mobile top bar image selectors via the selectors menu. Or just delete the ones without a blue dot (which signals you’ve added styles). And go to the Position group on Mobile top bar image selectors _2 and remove the position:fixed setting on the Phone tab.

Cheers,
Sebastian

You must login or register to reply to this topic.