How to hide text on mobile view within Static Block

Question

I'm currently working with a static block on our website. I'm trying to hide certain pieces of texts within this block when viewed on mobile. I've come across some answers which use CSS. However, I don't have access to the CSS file of our website.

Therefore my question is: Is it possible to achieve this without adjusting the actual CSS file within the static block?

Answer 1

Since you don't have access to a CSS file, I only see two options.

1 - Embed a stylesheet at the top of the static block. While editing the static block in question, click the orange Show/Hide Editor button, insert your CSS solution mentioned above, and click save. Clear cache, and refresh page.

Here is a sample:

<style>
@media only screen and (max-width: 767px) {
    .myclass{display:none;}
}
</style>

2 - Add a style tag and desired CSS to the head section of every page using the Miscellaneous Scripts section in the Magento Admin.

• While logged into the Magento Admin, navigate to System > Configuration > General > Design. Expand the HTML Head section and paste your CSS solution mentioned above (including the style tags). Save the configuration. Clear cache, and refresh page. The same code sample above applies.