Ден Тоцкий

т.к. строчные элементы, css между ними автоматически подставляет пробел. Его можно убрать просто указав размер шрифта в 0 для родительского элемента

figure {
  font-size: 0;
}

или использовать flexbox

figure {
  display: flex;
  flex-wrap: wrap;
}

Вот запили такой вариант https://jsfiddle.net/x6bu5zy3/

косяки в верстке, в частности в стилях лейаута. Все "блоки" стилизованы с помощью position: absolute;
я считаю это неправильным, вероятно с этим и возникли проблемы. попробуйте побольше прогуглить как расположить элементы сайдбара и контента без таких "костылей"

как вариант перекрытие одного лого другим
https://jsfiddle.net/c5o5qm7o/

попробуйте outline: none;

school-php.com/video подробные уроки, автор грамотно объясняет, самое то для новичков

ну можно последнему эл добавить margin-right: -.23em;

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

jsfiddle.net/0dtg8jk1/2

пример рабочий, может проблема со спрайтом? jsfiddle.net/#&togetherjs=JzxLGtpRAh

Если хотите чтобы вам помогли, напишите пример кода с проблемой

может дело в box-sizing: border-box; использете его ? просто пока кода нет, это сплошное гадание