Как сверстать ссылку с текстом по центру?
В нормальном браузере можно просто сделать так: a {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  text-align: center;
}
А вот если нужна поддержка ослика 11, то придётся грязно костылять(чем я сейчас заниматься, конечно, не буду:)).
Вот и появилось поколение людей, которые из ссылок будут делать гриды...
Ваша задача не решается при таких вводных никак. 
Мы можем выровнять текстовый контент внутри по центру (1), но при переполнении он и останется по центру (2).
Если есть возможность добавить внутрь вложенный элемент, то задача решается (3 и 4).snippet
---
Когда-нибудь это будет решаться так:.flex {
  align-items: safe center;
}
Но эта штука уже два года в черновиках и движений в эту сторону нет особо.