html - Can't make link inside td vertically centered -

As a homework I am creating a website, I created this menu using a "table" and put "a href". "The problem inside each" TD "is that I can not understand how the text written in" A "inside" TD "is standing.

" <">

>

  .men {width: 100%; height: 5 v. Range: 3px white solid; border width: 3px 0px; border color: alis;} td {width : 25%; vertical-row: center; text align: center; color: alis; font-family: aerial; font-size: 2vw;} a {color: alice; height: 100%; ur Whistle-line: center;} A: Hover {color: # 2f2f2f; background color: alice;}  

  & Lt; Table class = "male"> gt; & lt; tr & gt; & lt; td & gt; & lt; a href = "http://i.imgur.com/zxl58Pv.jpg?1" Style = "display: block; Width: 100%; Height: 100%; Text-decoration: none; "> Musei    Com / zxl58Pv.jpg? 1 "style =" display: block; Width: 100%; Height: 100%; Text-decoration: none; "> COMPITI   gt; & lt; td & gt; & lt; a href =" http: //i.imgur. Com / zxl58Pv.jpg? 1 "style =" display: block; Width: 100%; Height: 100%; Text-decoration: None; "Gt; Pageinley  & lt; td & gt; & lt; a href =" http: //i.imgur. Com / zxl58Pv.jpg? 1 "style =" display: block; Width: 100%; Height: 100%; Text-decoration: none; "> CONTATTI  gt; & lt; / TD & gt; & lt; / tr & gt; & lt; / table & gt;   

Inline style display: block; / Code>, because vertical-aligned works only on inline or table-cell . Code> box.

Alternatively, you can use

Code> TD A {display: block; padding: 1vw 0; No L-decoration: none;}

and remove all inline styles.

DEMO: