Header image to not float on mobile

Author Posts

gserafy

Heads up! this post was created when Microthemer was at version 6. The current version is 7. Some references to the interface may be out of date.

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 tick when you hover over it, rather than a green plus, to return to a selector.

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.