基于PHP变量的CSS媒体查询

Question

I have a multi-lingual website where all the text for the site is being loaded in based on a PHP session variable for each language. My problem here is that when the text is loaded in German, the menu bar on the top of my page becomes too long for it's container and some menu items drop below. This would be okay but the menu items that get dropped down are blocking sub menus from being selected.

Is there a way to use css media queries to reduce font size of my menu when a certain variable is selected?

Answer 1

There's no such media query but what you can do:

1. check if language in session is German
2. If no, do nothing more than you do at the moment
3. If yes, load one extra CSS file or extra rule where you have defined font-size for example this way:

nav ul li {
  font-size: 10px;
  font-size: 0.8rem;
}

This will change nothing for other language and for German language you can define custom CSS (font-size or of course anything else)