[Solved] Content Area style help

[Orest]

Guys,

I need to style content area so it looks like a page in a Word document (gray padding outside with white page in a middle). White space in middle needs to have a specific size. Let’s say 400X600. To accomplish this I created css for ContentAreaCssFile as follows

body {background-color: #a5a5a5!important;}  .PagePlaceholder   {background-image: url(images/pageBG.png); background-repeat:no-repeat;background-position: center top;     padding: 20px; margin:20px; }

The problem is that as soon as I set a height on PagePlaceholder class and click on that region in the editor It gets selected ( borders around it appear ) in IE 7 and 8. Work fine in FF. that selection makes it difficult to edit content that’s inside of PagePlaceholder div. can you please help me out here.

 
Thank you!

[Rumen]

Hello Orest,

The background-position: center top; class triggers hasLayout feature of IE in the content area of RadEditor.

My recommendation to achieve your scenario is to apply the following class and css properties to the table td wrapper element of RadEditor, e.g.

<style type="text/css">
.reContentCell
{
    background-color: gray !important;
    background-position: center top !important;
    padding: 20px !important;
    margin:20px !important;
}
</style> 

For your convenience I have attached my test project.

All the best,
Rumen
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Orest]

Thanks for suggestions!