ReActor Дмитрий Вершанский

let asideMenuLink1 = document.querySelector('.aside__menu-link1'),
selectedTab = document.querySelector('.selected-tab')

запятая после инструкции вряд ли играет положительную роль в js

Создать overlay-контейнер, которому "повесить" click-событие и отразить необходимые действия через функцию.

summary::marker {
    display: none;
}

.block {
    position: absolute;
    top: (N)px/%;
    right: 0;
}

,
где N - необходимая величина отступа в фиксированных значениях (px), или относительных (%)

Не рассматриваете такой вариант?
Сделать родительский блок сайдбара фиксированным по height и overflow-y: auto - ему же. Таким образом будет расти дочерний блок с элементами меню, а внешний будет оставаться неизменным. При этом, position: sticky будет делать свое дело.

Здравствуйте.

На любой из бирж. К примеру, Freelancehunt

Здравствуйте.

В grid существует понятие области - "areas". Благодаря им Ваша задача выполняется.

Приветствую.

Тег strong имеет семантическую цель. b, применяется лишь с целью визуального форматирования.

Приветствую!

<span>&#8730;x + &#8730;y<\span>

Приветствую!

Не совсем понятно, почему Вы хотите получить такое поведение блоков (поставленная задача), при этом создавая структуру саму по себе, говорящую напрямую - обратное.

У вас есть:
<header class="main-page-header header"></header>
, в который вы вкладываете div с библиотечным бутстраповским классом container... Определяете фон именно к внешнему семантическому контейнеру , который по умолчанию имеет width: 100%, как и любой другой блочный элемент. Это объясняет то, по какой причине фон на всю ширину области просмотра. С этим разобрались. Идем дальше.

Далее Вы вкладываете навигацию снова в .container библиотеки bootstrap, что и является ограничителем для вашего <nav>

Решение

Вытащите родительский контейнер навигации из ограничивающего .container, а вот его содержимое уже можете в него вкладывать, либо, по крайней мере, применяйте не .container, а .container-fluid

Приветствую.

Используйте принцип абсолютного позиционирования:

position: absolute;
top: x;
right: y;

Предварительно, указав родительскому элементу стрелки:

position: relative;

.selector {
    border: dashed 1px #00f;
    border-radius: 8px;
}

Приветствую!

Для "захвата" и отправки данных (иные манипуляции), используйте php или любую другую серверную технологию / язык

Здравствуйте!

"Вырывайте" соседние элементы из "нормального потока", средствами css. Иными словами преобразуйте статичное позиционирование в абсолютное. Это один из вариантов...

Приветствую!

Накопление, стилизация и позиционирование элементов при вёрстки, должно происходить таким образом, при котором, визуальный результат одинаково логичен и порядочен в большом диапазоне разрешений ( от 320px до 4096px ). Этот интервал захватывает весь перечень различных устройств, предназначенных, в том числе для просмотра интернет-страниц. Не нужно забывать о SmartTV, иными словами 4K-панелями, с которых сёрфингом по интернету занимаются так же часто , как это происходило исключительно со стационарных ПК, в свое время...

Для вёрстки должным образом, используйте медиа-запросы, в совокупности с сеткой (bootstrap, grid).

Для перехода от абсолютного и/или относительного позиционирования, используйте статическое позиционирование - position: static;