Aligatro

Полагаю вы хотели узнать как выровнять по вертикали, потому как по горизонтали у вас и так текст выровнен.

В целом, для того, что-бы что-то было возможно ровнять при помощи флексов, родитель элемента который нуждается в выравнивании обязательно должен быть флексовым.

Держите

Её можно и на html сделать. На css через keyframe. На js через velocity например (ну или ручками анимацию написать). В целом вариантов тьма: демо на jquery с учетом длины текста, тьюториал по созданию на чистом css, информация о html теге.

Держите - https://codepen.io/anon/pen/BJxEyR

https://jsfiddle.net/x65ygcsk/

Slider Syncing

<span class="items pizzanameM">Маргарита</span>
<span class="items pizzanameF">4 сыра</span>
<span class="items pizzanameV">Вегетарианская</span>

.items {
   display:inline-block;
}

Нет не будет, только с display:block;

Посмотрите здесь

.site-header ul.menu li.current-menu-item > a:focus {
    outline: none;
}

В стилях ставите после правил которые присваивают outline, если такой возможности нет - outline: none !important;

Насколько я помню это баг в хроме из-за саб-пикселей или что-то подобное. Короче попробуйте хак:
img {transform: translatez(0);}

https://jsfiddle.net/3k8dsmj0/

Можете попробовать вот так.

Скрывайте неиспользуемые слайды через visibility:hidden, и присваивайте visibility:visible для используемых - https://codepen.io/anon/pen/VzmoMP

$('#somediv').on('touchmove', function(){
   window.location.replace("http://example.com/somelink");
})

Не представляю для чего такое может понадобиться...

Вариант 1 и Вариант 2 для изображений.