When a Lightweight RadColorPicker has ShowIcon="true" and KeepInScreenBounds="true" configured, its tabs will be partially visible on the page.
The following solution can be used:
<script>
Telerik.Web.UI.ColorPicker.LightweightRenderer.prototype.getPaletteHeight = function ($palette) {
var paletteHeight = $palette.height() +
$palette.find(".rcpTabs").height();
return paletteHeight;
}
</script>
Possible workarounds: -set display: inline-block to the control wrapper -.RadColorPicker {display: inline-block;} - use Classic RenderMode - improve the z-index and backgrounds of the anchor: div.RadColorPicker.lwr div.rcpIcon a, div.RadColorPicker.lwr div.rcpIcon a:hover { z-index: 11; background-color: transparent; background-image: none; } where the lwr class is to be added from the server code to avoid breaking the Classic render mode: protected void Page_Load(object sender, EventArgs e) { if (RadColorPicker1.RenderMode == Telerik.Web.UI.RenderMode.Lightweight) { RadColorPicker1.CssClass = "lwr"; } }
Currently when the ShowIcon property of RadColorPicker is set to true and the controls does not have a selected color, a white color is displayed in the icon button. The expected behavior in this case would be to indicate that no color is selected, perhaps by displaying an image, similar to the one in the No Color button.
Setting RenderMode=Native doesn't work correctly in IE11.
ColorPicker Causes unwanted scrollbar in page if It is used in a RTL page. It's because of setting palleteWrapper.style.left to -9999px in hidePalette function in RadColorPicker.js. It can be fixed if you set palleteWrapper.style.left to something like 0 or 50%. It will be out of page due to -9999px as top value anyway.