[Bug?] Using Media Queries in the Service Portal

[Jordan14]

Hello Everyone,

I was hoping to customize the view for mobile devices via media queries but ran into an error where my pages would refuse to load until I removed the query from the CSS.

I've been storing my media queries on the Page Properties.

Here's the code:

@media only screen and (max-width: 375px) .text-4x {
    display: none;
}

It's a simple line of code which triggers the view of a text variable on my page.

But it seems to completely crash the page.

Any ideas?

Thanks,

Jordan

[ChrisBurks · Accepted solution]

I think there are some curly braces missing from your example that you posted:

@media only screen and (max-width: 375px) .text-4x {
    display: none;
}

I believe the media query should encapsulate the classes that pertain to that query. This should be the correct way:

@media only screen and (max-width: 375px) {

  .text-4x {
    display: none;
  }

}