tyzberd

вот ошибка https://habrastorage.org/webt/pw/x0/nh/pwx0nhgqpj9...
тут не хватает квадратной скобки https://habrastorage.org/webt/ys/5f/ij/ys5fijgkae6...

там есть

.carousel-control-next-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3e%3c/svg%3e");
}

Вам нужно такой же стиль добавить только в fill='%23fff' поменять fff на свой цвет (%23 это #)

потому, что getElementsByClassName возвращает массивоподобный (итерируемый) объект всех дочерних элементов, соответствующих всем из указанных имен классов и нужно обойти их циклом, или написать

document.getElementsByClassName('video_item')[0].getElementsByTagName('a')[0].getAttribute('href');

если нужны только первые

сначала выполняется js, а потом браузер переходит по ссылке.
так удаляет, но назад переход будет
https://codepen.io/tyzberd/pen/KLZNVV

tosster22, вам нужно сразу добавить прозрачный бордер, а при наведении менять цвет, что бы не прыгал блок. Еще вариант использовать box-shadow
https://codepen.io/michelre/pen/EoPMGv

первый вариант обернуть в тег с классом ui-front + свой класс и он будет создаваться в этом теге
https://codepen.io/tyzberd/pen/xeWgJr
второй classes api.jqueryui.com/selectmenu/#option-classes

флексами так не будет.
Используйте https://masonry.desandro.com/ или что то подобное https://ruseller.com/lessons.php?rub=32&id=2197
или grid, там уже смотрите или устраивает поддержка
https://medium.com/@andybarefoot/a-masonry-style-l...
https://codepen.io/balazs_sziklai/pen/mOwoLg

хотя если это не часто будет менятся, то можно и флексами. Две вертикальные колонки, а в них div с двумя картинками, потом одна большая и одна меньше

1. не вижу большой разницы, справа IE https://habrastorage.org/webt/nx/ug/x_/nxugx_okufv...
2. Как то не так подключаете, или нет кириллицы
3. если задано position: fixed; привязка идет к окну, как на тостере посмотрите сайдбар слева. Можно использовать top: 0; bottom: 0; тоже растянет на всю высоту

убрать br или задать для input

display: block;
margin: 15px auto;

https://codepen.io/tyzberd/pen/QPpKRd
и закрыть нормально strong

https://codepen.io/tyzberd/pen/PgpGJr

такое нашел.
https://www.npmjs.com/package/gulp-class-prefix
https://www.npmjs.com/package/gulp-html-prefix