Home
How to use SSW style in RadHtmlControl?
  v7.0 Posted at 5/11/2010 7:50 PM by SSW2000\BriteCheng

Do you know how to apply style to image, figure..etc?

Let's take the "AvoidReplyToAllWhenBcc" page as example.

First, the reason to cause the style issue is the style doesn’t apply to right place. Below is the html code after you adjust the figure manually (sorry, still not right ). Please look at the highlight part, 
  • the “ms-rteCustom-ImageArea” style doesn’t apply to <img> tag, but wrapped by <span> with “ms-rteCustom-ImageArea” style;  
  • there is no style apply to figure;

<span class="ms-rteCustom-YellowBorderBox">We have a program called <a href="http://rules.ssw.com.au/WebSites/RulesToBetterWebsitesLayout">
        SSW LookOut! for Outlook</a> to check for this rule.
        <br />
        <br />
       <span class="ms-rteCustom-ImageArea">
            <img style="border-bottom: 0px solid; border-left: 0px solid; border-top: 0px solid;
                border-right: 0px solid;" border="0" alt="Lookout Reply All BCC Warning" src="http://rules.ssw.com.au/WebSites/RulesToBetterWebsitesLayout" />
            <br />
       </span><b>
            <br />
            Figure: SSW LookOut! for Outlook warns you if you accidentally 'Reply All' when
            you have been BCC'ed  </b> </span>

1.  Not sure how user inputs the  content into this page. Anyway, here is the right way to add content via Telerik Editor. Please read below example of how I redo this part in Telerik Editor without changing the code manually
Copy content in notepad
Figure:Copy content in the notepad2. Delete the current content from Telerik for a new start;

3. Copy the first sentence from notepad and paste into Telerik Editor in the page; (please avoid copying straightly from web page and pasting them here, it will copy the all tags as well. it might affect the styles which can’t apply correctly )
Start copying content over
Figure: Start copying content over4. Insert the image
Insert an image
Figure: Add a link to text5. Add an image
Insert an image
Figure: Inser an image6. Press “enter” key to start a new row, then copy the figure from notepad to the Telerik editor area
Add figure
Figure: Add figure7. Apply image style to the image by click on the image, then choose a style from “Apply CSS Class” dropdown list
Apply style to the image
Figure: Apply style to the image

8. Apply style to the figure
Apply style to the image
Figure: Apply style to the figure9.Apply the yellow box
Apply style to the figure
Figure: Apply yellow border box to the content10. Check in the changes, then you will have - "dada.."
Right stlye in use
Figure: Right style in use

Related rules

    Do you feel this rule needs an update?

    If you want to be notified when this rule is updated, please enter your email address:

    Comments: