[Resolved] Can’t Seem to Hide Image on Mobile

[Daniel]

I am having issues hiding elements on my website.

I have used the following code that was in one of the support forum posts.

`/* For tablets and desktops */

@media(min-width:769px){
.test-1{
display: block;
}
}
/* For mobile */

@media(max-width:768px){
.test-1{
display: none;
}
}

I am trying to remove the gray line that is an image on the about page of my site.

Here is an image of the element that I would like to remove.

Here is a link to the page on my site.

[Leo]

Hi there,

Did you add this entire thing in the custom CSS field?
<div class="hide-on-mobile hide-on-tablet"> Content here will only display in Desktop </div>

If so please remove that and simply copy and paste in this:
hide-on-mobile hide-on-tablet

You shouldn’t need any CSS at all.

More info here: https://docs.generatepress.com/article/responsive-display/

Let me know if this helps 🙂

[Daniel]

Adding the hide-on-mobile hide-on-tablet worked.

Thanks for the help here Leo!

[Leo]

No problem 🙂

[Author]

Posts