Why isn't site displaying correctly on different device types in Chrome Devtools?

I'm testing a site locally using Chrome Devtools (and Firefox). When using Responsive mode, the site looks right when I select "Responsive", and on most device types I choose (iPhone 5, etc.).

But--sometimes--the site doesn't seem to respond to media queries when I pick a device (e.g., iPhone 6)--the site doesn't scale/resize per media queries.

Once that happens, it won't work in **any* device mode, including Responsive--until I switch to Responsive, scale the viewport to full size, and toggle Device Mode off and on again.

I've got the proper meta tag in every page, like so:

<meta name="viewport" content="width=device-width, initial-scale=1">

And my media queries are like so:

@media screen and (max-width : 700px)

This is a simple site that's several years old and being converted to responsive, hence just using "max-width".

Another clue: I can't scroll the site in the Responsive window with a scroll wheel or touch mouse, though I can do it no problem on other responsive sites.

I'd be grateful for any help. Driving me nuts. Must be something "simple", I know.