Большинство экранов настольных компьютеров и ноутбуков в настоящее время имеют ширину, превышающую высоту. Экран "широкий" не "высокий". Смартфоны сделали что-то довольно крутое, позволив ориентации телефона влиять на представление контента.

Я хотел бы сделать это с помощью медиазапросов, чтобы, если у кого-то на компьютере Mac с большим монитором размер окна браузера был таким, чтобы он был очень «высоким». (высота больше ширины) они увидят верхний и нижний колонтитулы. Но если они стали полноэкранными или "широкоформатными" (ширина больше высоты) они увидят боковую панель слева и, возможно, также справа.

Я пытаюсь в полной мере использовать преимущества широких экранов, ориентаций и тому подобного. Как это сделать с помощью медиа-запросов или JavaScript?