文字在表格位置处理—line-height

css:.main-wrap li{

    float:left;

    height:300px;

    background-color: #fff;

    border-radius: 4px;

    box-shadow: 0 1px 4px #a4a4a4;

    margin: 0 40px 40px;

    position: relative;

    width: 28%;

}

.done,.unfinished{

    float:left;

    width:210px;

    height:95px;

    text-align:center;

    background:#ecf0f1;

}

.done:hover,.unfinished:hover,.done.current{

    background:#ffffff;

    }

.done.current p{

    color:red;    

}

.main-wrap table{

    overflow:hidden;

    clear:both;

    }

.number{

    font:Fixedsys, "Microsoft YaHei UI", "Microsoft YaHei UI Light";

    text-transform:uppercase;

    font-size:34px;

    color:#95a5a6;

    margin-top:20px;

    }

.text{

    margin-top:15px;

    font:Fixedsys, "Microsoft YaHei UI", "Microsoft YaHei UI Light";

    text-transform:uppercase;

    font-size:12px;

    color:#95a5a6;

    }

.text-group tr{

      border-bottom: 1px solid #dee1e2;

      width:100%;

    

    }

.text-group tr td {

  padding-left: 20px;

    color: #7f8c8d;

    font-size: 13px;

    line-height:50px;

}

html:<ul class="play cf">

                   <li>

                    <a href="#"><span class=" done current"><p class="number">12</p><p class="text"> done course</p></span></a>

                    <a href="#"><span class="unfinished"><p class="number">3</p><p class="text"> unfinished course</p></span></a>

                    <table class="text-group">

                    <tr><td>Basic for UX Designer </td></tr>

                    <tr><td>10 steps to improve your wireframe  </td></tr>

                    <tr><td>A Better Way To Request App Ratings  </td></tr>

                    <tr><td>How To Speed Up Your WordPress Website</td></tr>

                    <tr> <td ><a><span></span></a></td></tr>

                    </table>
                   </li>