Mobile only content not showing

Tagged: 

This topic contains 4 replies, has 2 voices, and was last updated by  robertlo 6 years, 8 months ago.

Author Posts

robertlo

Sebastian,

On http://preachnet.com/freeindeed/product/circle-maker-pray-hard/

I have this:

<center><button class=”partner-button-phone” type=”button”><b>Become A Partner &
Access All Sermons</b></button>
</center>

<center><button class=”partner-button-non-phone” type=”button”>Become A Partner &
Access All Sermons</button>
</center>

The partner-button-phone class has display set to none in MT for all screen sizes except Phone and Phone & Tablet. The partner-button-non-phone class has display set to none in MT for all Phone and Phone & Tablet screen sizes.

But the button with class partner-button-phone is not showing up at all – not even on phones where it is supposed to show up.

I’ve never had this issue before with hiding content based on screen size. Perhaps I overlooked something simple. Hoping you can help as usual Sebastian.

Thanks,
Rob


Sebastian

Hey Rob,

In your Buttons folder, you have the following selector: Partner Button On Phones In Product Short Description.

On the Desktop & Tablet tab, you have hidden the button with a class of partner-button-phone. The Desktop & Tablet media query specifies a max-width: 979px condition. This affects mobile too, because their is no min-width condition.

The solution is to set display:block on the Phone tab for the Partner Button On Phones In Product Short Description selector. This will override the display:hidden value you set on the Desktop & Tablet tab.

Cheers,
Sebastian


robertlo

Sebastian,

I set display to block for selector “Partner Button On Phones In Product Short Description” to on Phone and Phone and Tablet & Phone tabs.

But the button is still not showing up on phones.

I’m wondering if it has something to do with this:

That selector has F tagged under All Devices from a previous setting. By tagged I mean the little icon that shows to indicate there is something edited in that section. But there is nothing actually for All Devices anymore. Could it be that something from the selector’s previous settings is messing something up, like it’s caching an old setting or something?


Sebastian

Hi Robert,

Could it be that we’re seeing different things again?

When I check your site I can see the button on the page with the partner-button-phone class. Here is a screenshot of my inspection of your site:

button is showing

I can also see the button when I access your site from a real phone.

Cheers,
Sebastian


robertlo

You’re right. It’s working. I guess it was just caching in the browser, which is strange because I was clearing the browser cache the whole time.

You must login or register to reply to this topic.