GreatRash

codepen.io/GreatRash/pen/VeREve

Мегаизврат конечно, проверял только в Хроме, но вроде должно работать во всех современных браузерах.

Вы знаете величину скролла (допустим проскроллили на 100 пикселей), далее вы должны сместить изображение на эту величину в противоположном направлении. Каждый слой должен иметь некий коэффициент смещения. Чем ближе слой к наблюдателю (т.е. чем больше его z-index), тем больше коэффициент (но не более 1).

Например:
слой 1 (звёзды - самый дальний от нас): смещение = 100 * 0,3
слой 2 (планеты): смещение = 100 * 0,6
слой 3 (ракета): смещение = 100 * 0,9

Крутим вниз, смещаем вверх. Я коэффициенты подобрал от балды (1 / 3 ~= 0,3), с ними можно поэкспериментировать.

Это потому что у ссылок text-decoration: underline; по умолчанию стоит. Вот пробелы и подчёркиваются :)
Либо поставить text-decoration: none; ссылкам, либо записать без переносов в виде: <a><img /></a>

UPD: и кстати, использовать в данном случае <figure> — крайне неправильно.

.element {
  direction: rtl;
  text-align: justify;
}

А при чём тут канвас? Или ты теги от балды пишешь? Чо тогда без 3D?

Смотря какие браузеры вам надо поддерживать. Если только новейшие и, допустим, без мобилок, то можно сверстать при помощи SVG и его фильтров. Иначе - картинка, как и советует Денис Инешин