Почему не правильно отображается сайт после загрузки на гитхаб pages?

ksenofontii,
Про пути к файлам https://htmlacademy.ru/blog/html/links

и где искать ошибку?

Открываете devtools (инструменты разработчика в браузере) правой кнопкой мыши или кнопками ctrl+shift+i, F12 и т.д. Сочетания могут быть разными в разных браузерах.
Переходите на вкладку Console.
Там будет ошибка с сообщением, что файл стилей не найден.
Теперь нужно обновить страницу. После этого будет показано, где браузер искал файл.
Вооружившись знаниями из статьи, нужно скорректировать путь, чтобы он вел к тому месту, где файл на самом деле есть.
Аналогично с картинками.

Скорее всего вы там навставляли пути к своему диску C или типа того. Логично, что из интернета неизвестно что у вас там на диске C.

Как можно такое сделать?

shsv382, реализацию покажете?

Почему перестал двигаться текст при создании сайта?

lenniqq,

но если убрать css код для картинок, конечно заезжать перестанет, но опять же текст двигать я не могу

В современном мире сетки удобнее всего верстаются флексами или гридами.
Флоаты используются только для того, для чего были предназначены изначально: обтекания одного элемента другими. Чаще всего это обтекание картинки текстом.
В вашем случае флоат там лишний. Об этом я написала и в первом комментарии.
Думаю, что и макет не подразумевает того, что текст футера должен быть слева от такой огромной картинки.

Итого: изучайте флексы и гриды.

p.s.
1. Ни Frame.png ни search.png не являются контентными изображениями. Им место в стилях. И В других местах аналогично.
Ну или в крайнем случае, нужно скрыть их от скринридеров.
2. Кучка лишних оберток, от которых можно легко избавиться. Например, span в меню, header_content, header_right (тут и с названием класса что-то нужно делать), main_content и т.д.
3. Теги бы лучше использовать в соответствии с семантикой, т.е. по смыслу.

Почему перестал двигаться текст при создании сайта?

Вы знаете, если я возьму тот код, который вы показали, сделаю страницу с этим кодом, то никто никуда не наползёт.

Поэтому, надо взять минимальный код, необходимый для воспроизведения проблемы, поместить его в песочницу типа codepen.io и показать нам.
Есть шансы, что разберетесь, пока делаете.

Альтернативный вариант от хрустального шарика: сразу пойти читать про float.

Как можно такое сделать?

Владимир, какой шрифт в макете?

Как можно такое сделать?

Владимир,

а зачем видео к низу прибивать, или вы имеете ввиду под текст...

да, под текст

тогда я не очень понял как это сделать гридом?

Может, откроете мой код в песочнице, да посмотрите? Там же всё так и сделано.

Как можно такое сделать?

Владимир,

А можно ссылку на решение, если оно отличается от тех которые здесь есть.

Эммм... Решения ниже в блоке ответов.

Как можно такое сделать?

Владимир, ну предположим, вас двое и все получили одинаковые задания и оба не могут сделать )) Первые два признались в том, что он один ))

Как сделать border-radius для тэга figure?

Только переполнение перестанет работать.
Если текста станет больше, он просто заедет на другие блоки и сломает верстку.

Как можно такое сделать?

Обычный flex.
flex-wrap для переноса строк, когда не влезают.
flex-grow для растяжения пустых спанов.
Спан с текстом покрасить в черный.

Видео прибить вниз гридом или абсолютом.

Что там может не получаться с сеткой?

Как можно такое сделать?

Вы же третий раз приносите сюда этот вопрос. И в одном их них было решение.
Не нужно каждый раз делать новый аккаунт.

Чем теперь пользоваться, когда Хабр Фриланс закрылся?

Искатель, пока выясняется, что эффективнее ездить в лифте

Как прописать стили для маски css, чтобы изображение отображалось сверху?

Так поменяйте маску наоборот.
Или просто наложите черную картинку поверх. Тут не ясно зачем вам нужна именно маска.

Как создать таблицу?

но не получилось из за того что строки имеют разный размер

Что именно из-за этого не получилось?
Размер это что? Ширина? Высота?
Уже 15 вопрос, а песочницы с примером нет.

Вообще, таблицы очень удобно делать тегами table. Как бы банально это не звучало.
Второй или дополняющий первый, вариант это grid и subgrid.

Как изменить ширину карусели owl-carousel Битрикс?

cssfish, сначала нужно вспомнить побочки.
Потом всё это сменить на swiper.

Как сделать что-бы действие применялось только в том блоке, где находятся кнопки и изменялось js в зависимости от размера экрана?

Как сделать что-бы действие переключения применялось только в том блоке, где находятся кнопки?

https://learn.javascript.ru/dom-navigation

Так-же до 768px клик идет по переключателю, после 768px клик идет на заголовки, как сделать что-бы код js переходил в это состояние без перезагрузки страницы?

https://developer.mozilla.org/ru/docs/Web/API/Wind...

Либо на CSS, предварительно использовав нормальные теги.
https://developer.mozilla.org/ru/docs/Web/CSS/poin...

Только зачем заставлять пользователя страдать и попадать обязательно в переключатель?

Как сделать такую анимацию кнопки при наведении?

ymfront, так и в примерах градиенты..

Как сделать так, чтобы строки таблицы не растягивались?

Сергей delphinpro, тогда tfoot не прилипнет, если я правильно поняла затею.

Как сделать так, чтобы строки таблицы не растягивались?

Malkolm, написала в ответы ))

Как вам калькулятор новичка?

есть какой то аргумент почему используются классы а не id?

Тогда уж data-