עריכה2:

כל מה שכתבתי לא רלוונטי, כי דווקא בjsfiddle התצוגה לא תקינה.
שים לב שהקישור לפונטים לא מאובטח (HTTP) לעומת jsfiddle שכן (HTTPS),
ולכן הוא בכלל לא טען את הפונט.

בבדיקה נוספת,
https://jsfiddle.net/qqcts4oh/2
אתה יכול לראות שעכשיו הפונט כן נטען, והתצוגה לא תקינה.

ולכן, כנראה שהבעיה היא בפונט.
(שאגב, אם לא שמנו לב בכלל שהפונטים שונים, אולי כבר עדיף לך להשתמש בArial ולחסוך את כל הבלאגן חחחח)



לא רלוונטי יותר -

לדעתי הבעיה היא לאו דווקא בקוד שהבאת.
יכול להיות שיש הגדרה כלשהי אחרת שמשפיעה על התצוגה, אבל עוד לא ממש הצלחתי למצוא מה היא.

הרצתי את הקוד שהבאת, ב jsfiddle -
https://jsfiddle.net/bc613nfk
והתצוגה נראית תקינה לחלוטין.

החלטתי לנסות להשוות קוד נקי יותר, כמו שהתחלת לעשות בjsfiddle, אבל עם קוד זהה של טבלאות:
https://jsfiddle.net/5bmn2o5b - תקין
http://codepen.io/anon/pen/BpmgEj - לא תקין

ולכן, כמו שאתה יכול לראות כנראה שמשהו בתצוגה של codepen לא תקין, יכול להיות שיש הגדרה אחרת באתר שלהם שמשפיעה על התוצאה.

אם זה קורה לך גם באתר שלך, תנסה למצוא דרך להביא את הקובץ המלא לכאן וננסה לזהות את הבעיה.
כמו הקוד שבדקתי למעלה, תנסה גם אתה ליצור קובץ חדש לגמרי עם קוד נקי של הטבלה בלבד, ותראה אם התצוגה אצלך באתר תהיה תקינה.


בכל מקרה, הטקסט כן ממורכז מבחינה אנכית. אם תיתן לתא בטבלה גובה כלשהו (לדוגמא height: 200px), אתה תראה שהטקסט מתמרכז. כך שההגדרה הזאת עובדת.
הבעיה שיש לו סטייה קלה למעלה, ואותה צריך לפתור.

פתרונות עקיפים יהיו להשתמש ב line-height או ב padding-top כדי ליישר את המיקום בצורה "ידנית" לפי העין.


עריכה:
עכשיו שמתי לב שפיספסתי את השורה האחרונה בהודעה של שימי, שבעצם מתמצתת את כל מה שאמרתי חחחח:

ציטוט:

תמיד כדאי לבדוק בקובץ HTML נקי שנפתח ישירות בדפדפן ולא במשהו שעטוף בקוד אחר שאין לדעת איך הוא משפיע...