This is a migrated thread and some comments may be shown as answers.

[Solved] Can't get transparent background in ie7

2 Answers 80 Views

Editor

This is a migrated thread and some comments may be shown as answers.

Michael asked on 12 May 2008, 05:15 PM

I am trying to get a transparent background for the content area of the editor in ie7. I have done the following:

1. Added a css file for the ContentAreaCSSFile and it contains:

    
            body{background:transparent !important;}

2. I have also added this to the page just before the editor:

    
            <style> 
        
                .radeditor.Default.rade_wrapper table td.rade_contentCell  
        
                {  
        
                    border: solid 1px black;  
        
                    background-color:Transparent !important;    
        
                }  
        
                body  
        
                {  
        
                    background-color:Transparent !important;  
        
                }  
        
                </style>

It seems that with this combination i get a transparent background in FF, but it just gives me a white background in ie7. If anyone has a suggestion that would be great. I'm using the newest version of the editor which doesn't seem t use iframes, so the allow transparency thing would not work as it has in the past for me.

What I am trying to accomplish is rendering the page and inserting the editor in editable areas. However I cannot figure a way to have the editor pick up on the parents style values.

2 Answers, 1 is accepted

answered on 13 May 2008, 03:29 PM

Hello Michael,

Please, try this solution

<head runat="server">
    <title>Untitled Page</title>
    <style>
    .radeditor.Default.rade_wrapper table td.rade_contentCell
    {
        border: solid 1px black;
        background-color:Transparent !important;
    }
    </style>
</head>

<body style="background-color: red;">
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server"/>
<script type="text/javascript">
function OnClientLoad(editor)
{
    var iframe = $get("RadEditor1Wrapper").getElementsByTagName("iframe")[0];
    iframe.allowTransparency = true;
}
</script>
<telerik:RadEditor ID="RadEditor1" OnClientLoad="OnClientLoad" runat="server">
<CssFiles>
    <telerik:EditorCssFile Value="~/ContentAreaCSSFile.css" />
</CssFiles>
</telerik:RadEditor>
    </form>
</body>
</html>

and in the ContentAreaCSSFile.css put the following class:

body
{
    background-color: Transparent !important;
}

I hope this helps.

Best regards,
Rumen
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center