.chart-bar{display:table;table-layout:fixed;width:100%;height:250px;background-image:linear-gradient(to top,rgba(0,0,0,.1) 2%,rgba(0,0,0,0) 2%);background-size:100% 50px;background-position:left top}.chart-bar.line-white{background-image:linear-gradient(to top,rgba(255,255,255,.1) 2%,rgba(255,255,255,0) 2%)}.chart-bar.no-line{background-image:none}.chart-bar li{position:relative;display:table-cell;vertical-align:bottom;height:250px}.chart-bar li span{margin:0 5px;display:block}.chart-bar li div{width:100%;text-align:center;padding:5px}.chart-bar li span::before{position:relative;top:0;width:100%;padding-top:5px;padding-bottom:5px;display:block;text-align:center;content:attr(title);word-wrap:break-word;overflow:hidden;opacity:.7}.chart-bar.size-1{width:80px}.chart-bar.size-1,.chart-bar.size-1 li{height:40px}.chart-bar.size-1 li span{margin:0 2px}.chart-bar.size-2{width:150px}.chart-bar.size-2,.chart-bar.size-2 li{height:60px}.chart-bar.size-2 li span{margin:0 4px}.chart-bar.size-3{width:250px}.chart-bar.size-3,.chart-bar.size-3 li{height:80px}.chart-bar.size-3 li span{margin:0 5px} |