Skip to content
Advertisement

How do I use @media queries in PHP?

I’m trying to add a width-responsive element to a client’s page. The website was made in PHP, which I’m not familiar with. I believe he’s also using WordPress (which I’m also not familiar with).

The .php pages don’t have any head tags to add external or internal css in, and attempting to add a head produced no results. He did inform me that all his css is loading from a file called “style.css” (though I can’t find any actual links to it), but attempts to add css to this file also produced no results on the page. I was able to style the element using inline css, but apparently there’s no way to set up @media queries inline.

As a last ditch effort, I finally got it working using Javascript with window.matchMedia, but it only detects the size when the window is reloaded (this is a second, separate problem I’m having). I’d still prefer to get it working using css somehow.

Advertisement

Answer

The final solution to this was to use Javascript, rather than CSS, to detect the page width.

  if (window.matchMedia("(min-width: 1300px)").matches)
    {
    $("#loading").css ("display", "inline");
    }
User contributions licensed under: CC BY-SA
8 People found this is helpful
Advertisement