#pickerPanel { width: 360px; height: 240px; font: normal 11px verdana, sans-serif; color: #333; line-height: 19px; margin: 0; } /* slider */ .dragPanel { position: relative; background-color: #eeeeee; margin: 4px; width: 260px; height: 180px; } .dragPanel h4 { background-color: #bbbbbb; height: 10px; margin: 0px; cursor: move; } input { font-size: .85em } .thumb { cursor:default; width:18px; height:18px; z-index: 9; position:absolute; } .bg { position:absolute; left:10px; height:18px; width:146px; border: 0px solid #aaaaaa; } .bg span, .bg p { cursor:default; position: relative; font-size: 2px; overflow: hidden; color: #aaaaaa; top: 4px; height: 10px; width: 4px; display: block; float:left; } .bg span { border-top:1px solid #cccccc; border-bottom:1px solid #cccccc; } .bg .lb { border-left:1px solid #cccccc; } .bg .rb { border-right:1px solid #cccccc; } #valdiv { position:absolute; top: 100px; left:10px; } #rBG {top:30px} #gBG {top:50px} #bBG {top:70px} #rgbSwatch { position:absolute; left:160px; top:34px; height:50px; width:50px; border:1px solid #aaaaaa; } #rgbPanel { /* top: 400px; left: 20px; */ width: 360px; height: 240px; } /* picker */ #hueThumb { cursor:default; width:18px; height:18px; z-index: 9; position:absolute; } #hueBg { position:absolute; left:216px; height:198px; width:18px; background:url(../img/hue.png) no-repeat; top:18px; } #pickerDiv { position:absolute; left:10px; height:187px; width:188px; /* background:url(../img/pickerbg.png) no-repeat; */ top:20px; } #pickerbg { position:absolute; z-index: 1; top:0px; left:0px; } #selector { cursor:default; width:11px; height:11px; z-index: 9; position:absolute; top:0px; left:0px; } #pickerSwatch { position:absolute; left:260px; top:30px; height:60px; width:60px; border:2px solid #aaaaaa; } #pickervaldiv { text-align:right; position:absolute; top: 86px; left:246px; } .colorbox{ width: 25px; height: 14px; border: 1px solid black; border-bottom-width: 0; }