.area-datasource { position: absolute; left: 5px; top: 5px; bottom: 5px; border: 1px solid #ccc; width: 220px; } .area-workspace { position: absolute; left: 230px; top: 5px; bottom: 5px; right: 5px; overflow-x: hidden; overflow-y: hidden; } .area-workbook { position: absolute; top: 0px; left: 0px; right: 0px; height: 50% } .area-formula { position: absolute; top: 50%; left: 0px; right: 0px; bottom: 0px; background-color: white; z-index: 20; } .datasource-title { height: 34px; line-height: 34px; font-size: 13px; font-weight: bold; padding-left: 15px; color: #655454; background-color: #eaeaea; } .datasource-body { position: absolute; top: 34px; left: 0px; right: 0px; bottom: 0px; overflow-x: hidden; overflow-y: auto; } .panel-buttons { position: absolute; top: 5px; left: 0px; right: 0px; height: 27px; background-color: #f6f6f6; border: 1px solid #ccc; font-size: 12px; padding-top: 2px; } .panel-formula { position: absolute; top: 40px; left: 0px; right: 0px; bottom: 0px; border: 1px solid #ccc; } .icon { color: #706868; } .formula-header { height: 36px; line-height: 36px; padding-left: 30px; padding-right: 30px; font-size: 12px; background-color: #fffafa; } .formula-header input { height: 23px; line-height: 23px; padding: 0 5px; border-radius: 4px; border: 1px solid #DCDFE6; color: #606266; outline: 0; box-sizing: border-box; -webkit-box-sizing: border-box; } .formula-header input:focus { border: 1px solid #c3c3c3; } .formula-header select { height: 23px; line-height: 23px; padding: 0 5px; border-radius: 4px; border: 1px solid #DCDFE6; color: #606266; outline: 0; box-sizing: border-box; -webkit-box-sizing: border-box; }