CSS

.<CLASSNAME>{

    border:silver thin solid; /*Creates thin silver-colored border around element with attribute class = "<CLASSNAME>" */

    background-color:dimgray; /*Sets background color to element*/  

    margin:0.5%; /*Sets outer gaps between element*/

    padding-left:2%; /*Sets gap between border and content of element*/

    color: silver; /*Sets font color of text content in element*/

    font-size: 2.5vh; /*Sets responsive size to text (responsive to viewport )*/

}

.<CLASSNAME>:hover{

    background-color:gray;   

    cursor: move;    /*Changes cursor to hand symbol, indicating the hovered element is clickable or draggable.*/

}

td{

    max-width: 120px;    white-space: nowrap;    text-overflow: ellipsis;    overflow: hidden;

}

td:hover{

    overflow: visible;     white-space: normal;    height:auto;

}

.mytblcss > thead > tr,

.mytblcss > tbody > tr {

    color:gray;

}

<div style="height:25px; line-height:25px; vertical-align:middle"></div><!--Note height and line-height needs to be given same value as div can be multi-lined hence element in first line seems up not in center.-->

<div style="width:80%; height:calc(100% - 22px); position:absolute; left:10%; top:20; border:silver thin solid; border-radius:3px; moz-border-radius:3px;">

<div>