I have a simple editor with a custom toolbar button. It shows an icon on the left side, and some text. When I mouse over the button the layout is messed up. Can't figure out why this is happening or how to stop it.
The issue is the same in Chrome, and IE 9 (with or without Compatibility Mode).
This is the editor code:
Attached are a couple images showing the button before and during a mouse-over.
The issue is the same in Chrome, and IE 9 (with or without Compatibility Mode).
This is the editor code:
<
style
type
=
"text/css"
>
.reTool_text .MergeFields
{
background-image: url(../Images/Icons/OneOffLetters/download.png) !important;
background-position: 0px !important;
}
</
style
>
<
telerik:RadEditor
ID
=
"RadEditor"
runat
=
"server"
Width
=
"100%"
OnClientCommandExecuting
=
"OnClientCommandExecuting"
AutoResizeHeight
=
"true"
EditModes
=
"Design"
ContentAreaMode
=
"Div"
>
<
Tools
>
<
telerik:EditorToolGroup
>
<
telerik:EditorDropDown
Name
=
"InsertImage"
/>
<
telerik:EditorTool
Name
=
"MergeFields"
ShowText
=
"true"
Text
=
"Insert Merge Field"
/>
</
telerik:EditorToolGroup
>
</
Tools
>
</
telerik:RadEditor
>
Attached are a couple images showing the button before and during a mouse-over.