problem with alignment

[jonathan]

Hi,

I am currently having a problem regarding the left, center and right alignment button on the rad editor.
When I try to click any of the alignment, all the text in the body of the rad editor moves to that position.

I would like the behavior of the alignment button to be like the microsoft word which only aligns the lines that the user highlighted, and this is not happening in telerik rad editor Q1 2008. Is there any option to make the alignment buttons work like the alignment buttons on microsoft word?

Regards,
Jonathan

[Serrin]

Hey Jonathan,

One thing I noticed a week or so ago is that the alignment applies to the current section of text, so if you have two separate paragraphs (<p>blah</p> and <p>blah2</p>), they are treated as separate items for alignment, so the first can be right, the second left, etc...  But if you go and enter text with a few enter key strokes in between, you end up with <p>blah blah <br/><br/>blah</p>, so when you hit alignment it takes what whole paragraph and applies alignment. 

Not quite the answer you need, but that might be enough to get you started on a solution.  It's all in how it generates the markup for what you're doing in how the text gets effected.

[Rumen]

Hi guys,

You can see the following KB article on the subject: Applying indentation or alignment per line.

Best regards,
Rumen
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[jonathan]

thanks.

[Priya]

hi,
I too have the same problem
I tried with the solution.now the indentation is working fine.but i couldnt remove the extra space
I applied this in the content page

 <telerik:RadEditor ID="editorDocument_text" EnableResize="true" runat="server" BackColor="white"
                                            Width="100%" ToolsFile="RadTools.xml" Skin="Vista" Style="top: 50px; overflow: auto;
                                            overflow-x: hidden;" NewLineBr="false" CssClass="editor">

P
{
    margin:0px !important;padding:0px !important;
}

blockquote
{
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

plz help me

thanks....

[Rumen]

Hello Priya,

You can put the global classes below:

<style type="text/css">
    P
    {
        margin:0px !important;padding:0px !important;
    }

    blockquote
    {
        margin-top: 0px !important;
        margin-bottom: 0px !important;
    }
</style>

either in the masterpage or inside the asp:Content control above RadEditor declaration in the aspx page:

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<style type="text/css">
    P
    {
        margin:0px !important;padding:0px !important;
    }

    blockquote
    {
        margin-top: 0px !important;
        margin-bottom: 0px !important;
    }
    </style>
<telerik:RadEditor ID="editorDocument_text" EnableResize="true" runat="server" BackColor="white"
                                            Width="100%" _ToolsFile="RadTools.xml" Skin="Vista" Style="top: 50px; overflow: auto;
                                            overflow-x: hidden;" NewLineBr="false" CssClass="editor"> </telerik:RadEditor>
</asp:Content>

For your convenience I have attached a video demonstrating my test.

Best regards,
Rumen
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Priya]

Hi,
Thanks alot for ur reply..
Atlast i found the problem..But i dont knw hw to solve.
I have used a CSS file in the page

 <telerik:RadEditor ID="editorDocument_text" EnableResize="true" runat="server" BackColor="white"
                                            Width="100%" ToolsFile="RadTools.xml" Skin="Vista" Style="top: 50px; overflow: auto;
                                            overflow-x: hidden;background-color:white;background-image:none !important" NewLineBr="false">
                                            <CssFiles>
                                                <telerik:EditorCssFile Value="~/customeditor.css" />
                                            </CssFiles>

The contents of that CSS is

.RadEWrongWord
{
background-color: yellow;
}
.RadEDomMouseOver
{
background-color:#ffffcc;
}
body
{
padding:3px;
background-image: none;
margin: 0px;
text-align: left;
 overflow:scroll;

scrollbar-face-color: #E9E9E9;
scrollbar-highlight-color: #FFFFFF;
scrollbar-shadow-color: #E9E9E9;
scrollbar-3dlight-color: #DBDBDB;
scrollbar-arrow-color: #787878;
scrollbar-track-color: #F5F5F5;
scrollbar-darkshadow-color: #AEAEAE;
word-wrap: break-word;
}
form
{
background-color:#efefef;
border:1px dashed #555555;
overflow:scroll;
}
table
{
BORDER-RIGHT: #999999 1px dashed;
border-bottom: #999999 1px dashed;
overflow:scroll;
}
table td
{
PADDING: 1px;
border-top: #999999 1px dashed;
BORDER-LEFT: #999999 1px dashed;
overflow:scroll;
}
table th
{
PADDING: 1px;
border-top: #000000 1px dashed;
BORDER-LEFT: #000000 1px dashed;
overflow:scroll;
}

I commented the

<CssFiles>

<telerik:EditorCssFile Value="~/customeditor.css" />

</CssFiles>

and the new line problem fixed.
But i need this CSS file..I put the code in the customeditor.css file

P
{
 margin: 0px !important;
 padding: 0px !important;
}

blockquote
{
  margin-top: 0px !important;
  margin-bottom: 0px !important;
}

but extra line space problem now exists

plz help me...

[Martin]

Hi Priya,

Please, find attached a sample project of RadEditor with <p> and <blockquote> tags reset to zero padding and margin.

The selectors that reset the default values of these tags are at the bottom of customeditor.css file, i.e:

p, blockquote        
{        
 margin: 0px !important;  
 padding: 0px !important;        
}

The CSS selectors are case-sensitive, so make sure that you keep the casing, i.e. P != p.

Have a great weekend,
Martin Ivanov
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.