Как вставлять картинку в svg path?

Как всё это должно выглядеть?
Почему ромб нельзя задать фоном, а картинку img или вторым фоном?

Почему есть отличия примера с реальным проектом ( используется галп)?

Старый пример, в котором не указано свойство без префиксов.

Вы же можете настраивать автопрефиксер по желанию https://browserl.ist/?q=>%202%25

p.s. синтаксис sass устарел, переходите на scss.

Можно ли в css content:"" всунуть ссылку?

Можно вставить путь для картинки.
Кликаться сама по себе она не будет.

Чтобы кликалось родителем должна быть ссылка либо клик через js, но на самом элементе.

Как правильно подключить шрифты?

Проверяйте ошибки в указанных строках в php и рядом. Кавычки, скобки, точки с запятыми и т.д.

Почему внутренний div прижимается к краю экрана, а не к краю родителя?

Прямой родитель этого блока не relative, а ближайший родитель с relative на всю ширину экрана. Итого: блок прижимается к краю экрана.

Как сделать такой блок/таблицу?

GreenMan1899, универсально не придумала.
Я бы оставила таблицами.

Почему css гриды не работают на ie11, хотя префиксы выставлены?

GreenMan1899, в предыдущем вопросе написала как работают.
Без жесткого распределения по строкам не получилось.

Как сделать такой блок/таблицу?

GreenMan1899, так работает https://codepen.io/anon/pen/zbNyRr

Как сделать такой блок/таблицу?

GreenMan1899, на гридах не вижу.
Пока так: Css grid не работает в IE11?

Перестал восприниматься id в CSS. Как сделать чтоб всё заработало?

Vzun, ссылку на проблему покажите.
Нужно проверять ошибки в остальных местах.

1. Не используйте для стилизации id

2. Цвет фона в bg логичнее пишется перед последним фоном. Поскольку он у вас один, то так:

background: #1C1C1C url("../images/moneti.png") 885px 25px no-repeat / 220px;

Как сделать такой блок/таблицу?

GreenMan1899, https://codepen.io/anon/pen/QodZrE так чтоль?

Или как нужно-то?

Почему не работает сокращение текста троеточием в таблице?

фиксированную ширину ячейке
display: block ссылке

либо
table-layout: fixed таблице
col расставьте

Как называется CSS фреймворк / библиотека для вёрстки только именами классов?

Никак не могу вспомнить название

Это сознание очень правильно поступило.
И не вспоминайте.

Как сверстать полоску состоящую из множества кругов?

Серафим, и что не выходит?

background-repeat надо поменять на repeat-x либо вычислять ширину второй полоски
и накладывайте на здоровье

Как сделать такой блок/таблицу?

Ваш код -> jsfiddle.net

И скрин таблицы иллюстрирующий это

у нее первые два столбца могут быть разной ширины исходя из контента.

Как натягивать такую функциональность на Wordpress?

2 кнопки.
По нажатию на кнопку блоку применяется свой класс (на js).
Остальное на CSS.

Как сверстать такой элемент, если блоков не 4 а больше?

arzamas-nick, полноценный лендинг в формате png вероятнее всего значит, что дизайнеру они не заплатили.

Как сверстать такой элемент, если блоков не 4 а больше?

arzamas-nick, ну так там тоже самое: пока помещаются в строку пусть помещаются, на мелких в столбик. На средних можно змейкой.

Остальные просили полноценную страницу сверстать.

Всегда говорю, что полноценная страница требует полноценной оплаты. Причем с предоплатой 50%.
Альтернатива: я верстаю только часть этой страницы один или 2 блока, этого достаточно, чтобы оценить как я это делаю.
Если ни один из вариантов не подходит, значит это развод и желание получить работу на халяву.

Как сверстать такой элемент, если блоков не 4 а больше?

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

arzamas-nick, я бы вообще убирала эти палочки на мобильных.

Но опять же, это проблема дизайнера что с ними делать. Если только вы не дизайнером устраиваетесь.

Как сверстать такой элемент, если блоков не 4 а больше?

arzamas-nick, и вы всё еще хотите там работать? ))