div.users-tree { line-height: initial; } .edges { font-family: monospace; line-height: initial; } div.main-container { width: 600px; } div.ips-row { margin-bottom: 0px; display: flex; flex-direction: row; justify-content: center; /*line-height: 0;*/ } div.ips-cell { display: inline-flex; flex-direction: column; justify-content: center; background-color: #faf4fa; width: 60px; height: 60px; margin: 0px; border-bottom: 1px solid lightgray; border-right: 1px solid lightgray; text-align: center; position: relative; overflow: hidden; } div.ips-cell.ips-top { border-top: 1px solid #aaa; } div.ips-cell.ips-left { border-left: 1px solid #aaa; } div.ips-cell.ips-right,div.ips-ver-half { border-right: 1px solid #aaa; } div.ips-cell.ips-bottom,div.ips-hor-half { border-bottom: 1px solid #aaa; } div.name { max-height: 70px; } span.ip { position: absolute; bottom: 2px; right: 0.5em; color: #aaa; font-weight: bold; font-size: x-small; } span.lock { position: absolute; bottom: 2px; left: 0.7em; color: #aaa; font-size: small; } div.ips-cell.dhcp-pool { background-color: #bed; } div.ips-cell.dhcp-pool.hover { background-color: #acdccc; } div.ips-cell.hover { background-color: #eae4ea; } div.ips-cell.unusable { background-image: url(../img/unusable.png) }