editor tool bar renders button / icons incorrectly

[tony]

The kendoEditor does not display its toolbar correctly. Code is as follows in an asp.net mvc context. The editor is displayed in a popup generated by kendoui.

html followed by javascript

<div  class="popupContent" >

  <div class="k-content" style="margin-left:25px; margin-top:25px">

      <textarea id="Editor" rows="10" cols="30" ></textarea>

  </div>

</div>


<script type="text/javascript">

    var Editor = $("#Editor").kendoEditor({

       tools: [

         "bold",

          "italic",

          "underline",

          "strikethrough"

         ]

 

    }).data("kendoEditor");

    $(".k-editor").height("350px");

    $(".k-editor").width("900px");

</script>

The visual display is found in the image attachment. the buttons and icons are bunched and overlapping.
Kendo UI Web v2012.2.1029 
jQuery v1.7.1
jQuery UI 1.8.11i
ie9
visual studio 2010

using newer jquery did not help.

[Dimo]

Hello Tony,

It seems that the Editor is using a custom theme and the background position styles of the icons are not correct. Alternatively, the CSS code and the sprite image are from different versions, so the background position styles do not correspond to the actual icon positions in the sprite image. Please compare the theme that you are using with a one that works correctly.

If you need further assistance, please provide your theme and background images.

Regards,
Dimo
the Telerik team