[解決済み] CSS メディアクエリ: max-width OR max-height

質問

CSSメディアクエリを記述する際、"OR"のロジックで複数の条件を指定する方法はありますか？

このようなことをしようとしています。

/* This doesn't work */
@media screen and (max-width: 995px OR max-height: 700px) {
  ...
}

解決方法は？

2つ（またはそれ以上）の異なるルールを指定するには、カンマを使用します。

@media screen and (max-width: 995px), 
       screen and (max-height: 700px) {
  ...
}

から https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries

カンマは、複数のメディアクエリを1つのルールにまとめるために使用します。カンマで区切られたリスト内の各クエリは、他のクエリとは別に扱われます。したがって、リスト内のクエリのいずれかが真であれば、メディア文全体が真を返します。つまり、リストは論理演算子や演算子のような働きをする。