Safari web inspector breaks media queries

Using Safari Version 11.1, whenever I open the web inspector on a web page, all media queries in the CSS stop working. If I close the inspector, the problem goes away. This happens on any site.

Are other people experiencing this? Is there a setting that I've toggled?

Any help would be much appreciated! Thanks.

Solution 1:

Probably you enabled "Force Print Media Styles" (a small printer icon in the upper right corner under the Elements tab):

Solution 2:

I also have experienced this problem. After doing some research I finally manage to solve the problem.

Backup and remove ~/Library/WebKit/com.apple.Safari folder.

A problem should disappear after that operation. Enjoy :D