Hi,
I am using Rad Editor in my project that I have created with VS2010. In my project i have created a custom context menu. i want to apply custom css class on this context menu. please give me any idea or help.
i have use following code.
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="b.aspx.vb" Inherits="ComplianceTable.b" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<telerik:RadScriptManager ID="ScriptManager1" runat="server" />
<telerik:RadEditor runat="server" ID="RadEditor1">
<ContextMenus>
<telerik:EditorContextMenu Enabled="false" TagName="TD">
</telerik:EditorContextMenu>
<telerik:EditorContextMenu Enabled="false" TagName="TABLE">
</telerik:EditorContextMenu>
<telerik:EditorContextMenu TagName="TD">
<telerik:EditorTool Name="EditTable" Text="EditTable" ImageUrl="Images/modify.png" />
<telerik:EditorTool Name="SetCellProperties" />
<telerik:EditorTool Name="SetTableProperties" />
</telerik:EditorContextMenu>
</ContextMenus>
<Content>
<table style="margin: 0pt auto; clear: both; width: 500px; height: 50px;">
<thead>
<tr>
<th style="background-color: #ebf1dd;">Browser/OS</th>
<th style="background-color: #ebf1dd;">Windows</th>
<th style="background-color: #ebf1dd;">Mac OS</th>
<th style="background-color: #ebf1dd;">Linux</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align: left; vertical-align: middle;"> Internet Explorer</td>
<td style="background-color: #f2f2f2; height: 3px;">6.0+</td>
<td style="background-color: #e5e0ec;">- </td>
<td style="background-color: #dbeef3;">- </td>
</tr>
<tr>
<td> Firefox</td>
<td style="background-color: #f2f2f2;">1.5+</td>
<td style="background-color: #e5e0ec;">1.5+</td>
<td style="background-color: #dbeef3;">1.5+</td>
</tr>
<tr>
<td> Google Chrome</td>
<td style="background-color: #f2f2f2;">0.2+</td>
<td style="background-color: #e5e0ec;">5.0+</td>
<td style="background-color: #dbeef3;">5.0+</td>
</tr>
</tbody>
</table>
</Content>
</telerik:RadEditor>
</div>
</form>
</body>
</html>
I am using Rad Editor in my project that I have created with VS2010. In my project i have created a custom context menu. i want to apply custom css class on this context menu. please give me any idea or help.
i have use following code.
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="b.aspx.vb" Inherits="ComplianceTable.b" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<telerik:RadScriptManager ID="ScriptManager1" runat="server" />
<telerik:RadEditor runat="server" ID="RadEditor1">
<ContextMenus>
<telerik:EditorContextMenu Enabled="false" TagName="TD">
</telerik:EditorContextMenu>
<telerik:EditorContextMenu Enabled="false" TagName="TABLE">
</telerik:EditorContextMenu>
<telerik:EditorContextMenu TagName="TD">
<telerik:EditorTool Name="EditTable" Text="EditTable" ImageUrl="Images/modify.png" />
<telerik:EditorTool Name="SetCellProperties" />
<telerik:EditorTool Name="SetTableProperties" />
</telerik:EditorContextMenu>
</ContextMenus>
<Content>
<table style="margin: 0pt auto; clear: both; width: 500px; height: 50px;">
<thead>
<tr>
<th style="background-color: #ebf1dd;">Browser/OS</th>
<th style="background-color: #ebf1dd;">Windows</th>
<th style="background-color: #ebf1dd;">Mac OS</th>
<th style="background-color: #ebf1dd;">Linux</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align: left; vertical-align: middle;"> Internet Explorer</td>
<td style="background-color: #f2f2f2; height: 3px;">6.0+</td>
<td style="background-color: #e5e0ec;">- </td>
<td style="background-color: #dbeef3;">- </td>
</tr>
<tr>
<td> Firefox</td>
<td style="background-color: #f2f2f2;">1.5+</td>
<td style="background-color: #e5e0ec;">1.5+</td>
<td style="background-color: #dbeef3;">1.5+</td>
</tr>
<tr>
<td> Google Chrome</td>
<td style="background-color: #f2f2f2;">0.2+</td>
<td style="background-color: #e5e0ec;">5.0+</td>
<td style="background-color: #dbeef3;">5.0+</td>
</tr>
</tbody>
</table>
</Content>
</telerik:RadEditor>
</div>
</form>
</body>
</html>
1 Answer, 1 is accepted
0
Hi Gyan,
You could do that by creating a custom CSS file and link it to your document. The context menus of the RadEditor are in a wrapper with class name reDropDownBody. You can use this class name as parent element to style the child elements. You can find more information about the RadEdtiror's class names in this help article.
I am attaching you an example project with custom stylization of the context menu, so that you could follow it as a guide for your CSS styles.
Regards,
Ianko
Telerik
You could do that by creating a custom CSS file and link it to your document. The context menus of the RadEditor are in a wrapper with class name reDropDownBody. You can use this class name as parent element to style the child elements. You can find more information about the RadEdtiror's class names in this help article.
I am attaching you an example project with custom stylization of the context menu, so that you could follow it as a guide for your CSS styles.
Regards,
Ianko
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.