Applying different background colors to selected paragraphs

Hello there,
In the text that is loaded dynamically as XML (i.e. markup format) I need to specify background color for selected paragraphs.
So, I tried this: <p backgroundColor='#800000'>.
Alas, it has no effect.
What puzzles me even more is that declaring this attribute in span DOES work:
<p><span backgroundColor='#800000'>Lorem impsum ... </span></p>
This way it does change the background color, albeit, it is not solid background but sort of highlight of the text lines.
Although, it's not ideal, I could live with that, but still would be interested to find out: what am I missing?
After all, span can't have children, so it is a patch rather then nice solution.
So, far I couldn't find the explanation of that behavior - ignoring 'backgroundColor' attribute in the paragraph tag.
I'm on Mac 10.6.6 and use TLF 2.0 build 228
BTW, searching for an answer I found a typo in the official TLF 1.1 Markup specification that was published back in December:
6.3.13 backgroundColor attribute
<xs:attribute name="textAlpha" type="xs:text" default=" transparent"/>
Background color of the text.
backgroundColor is non-inheriting.
Valid values include:
• transparent: No color is applied.
• <hexadecimal value>: A value that conforms to the color data type.
Thanks,
Igor Borodin

Here is the app and the screen shot of the runtime error:
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
   xmlns:s="library://ns.adobe.com/flex/spark" >
<fx:Script>
<![CDATA[
import spark.utils.TextFlowUtil;
XML.ignoreWhitespace = false;
[Bindable]
private var txtXML:XML = <TextFlow version="2.0.0" xmlns="http://ns.adobe.com/textLayout/2008" fontSize='18' >   
    <p>
<g>Lorem ipsum dolor sit amet,
<span color='#880000'>consectetur adipiscing elit.</span>
Quisque tempus, eros ac dignissim interdum, elit sem euismod velit,
<span fontStyle='italic'>eget laoreet urna metus nec enim.</span>
</g>
</p>
</TextFlow>
]]>
</fx:Script>
<s:RichText horizontalCenter="0" verticalCenter="0" width="200"
textFlow="{TextFlowUtil.importFromXML(txtXML)}" />
</s:Application>
I'm on Mac 10.6.6 Flex Hero 4.5 TLF 2.0 build 228
It's the same on Safari and FireFox
HTH,
Igor Borodin

Similar Messages

  • Apply Different Background Color to Promoted Links Tiles

    Hello everyone,
    Does anybody know a way of changing the background color of each individual tile of Promoted Links? If possible, and if anybody is familiar, I would like to do it using a JS Link file.
    Thanks in advanced.
    Fausto Capellan, Jr - SharePoint Admin

    Hi Fausto,
    You could try the script below to set color without randomly change:
    <script src="http://code.jquery.com/jquery-1.10.2.min.js" type="text/javascript"></script><script type="text/javascript">
    $(document).ready(function () {
    var id;
    var rgb;
    var rgb1;
    var rgb2;
    var rgb3;
    for (var i = 0; i < $("div.ms-tileview-tile-content").length; i++){
    id = $("div.ms-tileview-tile-content")[i].id;
    if(i%2 == 0){
    rgb1 = getRgb(0,i);
    rgb2 = getRgb(50,i);
    rgb3 = getRgb(150,i);
    }else{
    rgb1 = getRgb(150,i);
    rgb2 = getRgb(50,i);
    rgb3 = getRgb(0,i);
    rgb = "rgb("+rgb1+","+rgb2+","+rgb3+")";
    $("#"+id).css("background-color",rgb);
    function getRgb(n,i){
    var rgbNum = n + i *25;
    if (rgbNum < 255){
    return rgbNum;
    }else{
    getRgb(1,1);
    </script>
    Please set the parameter “n” with number per your situation in the function getRgb(n,i). The screenshot below is my result:
    Regards,
    Rebecca Tu
    TechNet Community Support

  • Defining a background color for a paragraph style

    Hello and please excuse this very basic question, but I am completely stumped.
    How do I simply define a background color for a paragraph style? I cannot use a table etc. because the styles are mapped during an XML conversion. Code lines should receive a gray background box to separate them from the text.
    Also, is there a way to force line breaks whithin words for a specific style? The text, formated in Courier, should just fill the space with a fixed width per character and break wherever the line ends.

    With some drawbacks it's doable using two paragraph tags.
    The first tag, e.g. "Line" is empty (no text), and it has a reference page graphic that's just a rectangle filled 100% with color and set to have a percentage tint so that the text will "show through" it.
    "Line" is also set to have a negative space below it, e.g. -12 points.
    "Code" paratag has the actual code text in it, and it's set to have a negative space above, e.g. -12 points.
    I've done projects where I have multiple Line paratags differing by the number of code lines needing to be shaded, e.g. Line1, Line2, Line3.
    Unfortunately there isn't a way to automatically have the line expand to the correct depth of the Code paragraph, although I believe this would probably be something that could be done as a Framescript, to run through a document and create new "line" paratags of the correct depth depending on how many Code paragraphs or lines are in the following paratag.

  • Rows with different background color in array

    I am displaying an array indicator. When certain values are found in a row of the array, I would like the row to have a different background color so that it stands out on the front panel. Can this be done? Especially, can this be done using property nodes dynamically?
    Thank you

    Hi jmaarek,
    I don't think you can do this with arrays as all the elements have the same properties.
    You can do this with a table though. Use the 'Active Cell' property (set the row to -2 to select the entire row) and the 'CellBGColor' property.
    Hope this helps.

  • Change different background color in row grid

    Hi,
        i want to change different  background color in row grid..ex.two different colors should continue in all row grid..pls guide me ..
    Regards,
    Senthil.

    Hi Senthil,
    If I understand you correctly, you wish to show a grid with alternating colours down the rows.
    You have a few options:
    1) Apply a stylesheet nd display it as HTML.  But this solution lacks the advantages of the iGrid
    2) Return a field with alternating 1's and 0's in the query and use this field in the Colour-Context mapping
    3) Use JavaScript to loop through each row and set alternating background cell colour for all columns
    Hope this helps.
    Cheers,
    Jai.

  • Different background color in  summation

    Is there any possibilities to set the different background color and applied the conditional format in summation columns in vertical table in obiee answers.
    Kindly let me know asap.
    Thanks in advance.

    Hi,
    Do you mean in grand total columns? if so just click on edit table view >> beside the summation symbol click on the properties button there you can change the font color or back ground color etc...
    Update if required.
    Mark if Helpful/correct.
    Thanks.

  • How to set background color for selected days in DateChooser

    How to set background color for selected days. I created
    checkbox for each day [Son,Mon,Tue,Wed,Thu,Fri,Sat] and a
    DateChooser, I want to change the background color for the selected
    day when i click on a button after selecting the desired checkboxs
    [ monthly wise/yearly wise]
    Thanks in advance

    There is no button involved in the following code, but it may
    be of use to you:
    <?xml version="1.0"?>
    <mx:Application xmlns:mx="
    http://www.adobe.com/2006/mxml"
    creationComplete="init()">
    <mx:Script>
    <![CDATA[
    private var origColor:uint;
    private function init():void {
    origColor = dc.getStyle("selectionColor");
    public function setBackGrdColors(newColor:uint):void {
    dc.setStyle("selectionColor", origColor);
    if(dc.selectedDate){
    var dayOfWeek:Number = dc.selectedDate.day;
    else{
    return;
    switch(dayOfWeek) {
    case 0:
    if(sun.selected)
    dc.setStyle("selectionColor", newColor);
    break;
    case 1:
    if(mon.selected)
    dc.setStyle("selectionColor", newColor);
    break;
    case 2:
    if(tue.selected)
    dc.setStyle("selectionColor", newColor);
    break;
    case 3:
    if(wed.selected)
    dc.setStyle("selectionColor", newColor);
    break;
    case 4:
    if(thu.selected)
    dc.setStyle("selectionColor", newColor);
    break;
    case 5:
    if(fri.selected)
    dc.setStyle("selectionColor", newColor);
    break;
    case 6:
    if(sat.selected)
    dc.setStyle("selectionColor", newColor);
    break;
    default:
    break;
    ]]>
    </mx:Script>
    <mx:VBox horizontalAlign="center" verticalGap="20">
    <mx:DateChooser id="dc" textAlign="left"
    change="setBackGrdColors(cellColor.selectedColor)"/>
    <mx:HBox width="100%" horizontalAlign="center">
    <mx:CheckBox id="sun" label="Sun"/>
    <mx:CheckBox id="mon" label="Mon"/>
    <mx:CheckBox id="tue" label="Tue"/>
    <mx:CheckBox id="wed" label="Wed"/>
    </mx:HBox>
    <mx:HBox width="100%" horizontalAlign="center">
    <mx:CheckBox id="thu" label="Thu"/>
    <mx:CheckBox id="fri" label="Fri"/>
    <mx:CheckBox id="sat" label="Sat"/>
    </mx:HBox>
    <mx:HBox width="300" horizontalAlign="center">
    <mx:Label text="Background Color" />
    <mx:ColorPicker id="cellColor"
    selectedColor="#FF00FF"/>
    </mx:HBox>
    </mx:VBox>
    </mx:Application>

  • Can I get different background colors on menu items?

    I've been trying to get different background colors on my menu (Quick launch) items for a while, without success. What I want is the even numbered items (the second, fourth, sixth...) to have a different background color than the uneven ones (first, third,
    fifth...).
    Anyone knows if this can be done?
    Thanks, guys!

    Can you do something in the javascript code where you have given specific IDs to each buttons in your menu? It could end up in something like "$('#menu_id').css('background-color', '#1B3E70');"
    Or, let say you have controls defined like thie:
    <body>
    <ul class="menu">
    <li class="menu-item"><a>item 1</a></li>
    <li class="menu-item"><a>item 2</a></li>
    <li class="menu-item"><a>item 3</a></li>
    </ul>
    </body>
    Can't you write at render stage this kind of actions by index:
    var i = $("li").index( $(this).parent() );
    if ( i === 1 ) {
    $('body').css('background', 'red');
    } else if ( i === 2 ) {
    $('body').css('background', 'green');
    } else {
    $('body').css('background', 'brown');

  • Want to change the Background Color of Selected Tab

    Hi All,
    I want to change the Background Color of Selected Tab of the tabstrip visible in Content Admin Role (Browse, Overview etc.).
    I have changed the Background Color of Selected Tab - Tabstrips-Complex Elements through Theme Editor, but that did not take effect.
    Only the other webdynpro components tabstrips took effect.
    Regards,
    Vishal

    Hi Andre,
    I don't know if you have already figured out how to change the background color of the tabstrip, but I will explain how we have done it.
    You might have tried to change the background color in "Tabstrip" (under the menu "Complex Elements") in Theme Editor. When you change the property "Background color of selected/unselected tabs", this will not change the color of the images on the tabstrip (ex. the triangle on the side of the tab). These images are on the server. We copied these images and then made changes to them, before we uploaded them again through the Theme Editor.
    The path to find the images is /usr/sap/~/JC01/j2ee/cluster/server0/apps/sap.com/irj/servlet_jsp/irj/root/portalapps/com.sap.design.urdesigndata/themes/portal/the name of your theme/common/tablist
    If this didn't work for you, you might have to change the properties in "Pattern Containers" (under Complex Elements") in Theme Editor. The tablist properties are under the header "Tab Container".
    I think it should work for you then. We also found that there was some problems when we tried to view the changes in Firefox, but haven't figured out how to solve this.
    /Ellen

  • Different background color in panelBox's header

    Hi,
    I need to have a different background in the header of the panelBox than the background color of its content.
    <af:panelBox text="Aug 8, 20121"
    id="pb5"
    titleHalign="center"
    type="flow"
    showDisclosure="false"
    ramp="highlight"
    background="light">
    I understand that we can change style in css. But I only want this style of panelBox apply to one UI page only. It should not affect panelboxes in other UI pages.
    How can I achieve this? What's the syntax of changing the background color of panelBox's header?
    Thanks
    -Mina

    Hi,
    the solution is to use instance specific skinning. In this you define a styleCalss name for the panel box you want to change
    <af:panelBox
      icon="/skins/images/guy.gif"
      text="PanelBox Instance Skinned"
      styleClass="DifferentBackgrundColor">
          <f:facet name="toolbar"/>
    </af:panelBox>.DifferentBackgrundColor af|panelBox::header-start,
    .DifferentBackgrundColor af|panelBox::header-center,
    .DifferentBackgrundColor af|panelBox::header-end,
    -tr-inhibit:background-image;
    background-color:red;
    Frank

  • Change the background color of selected row in adf table

    Hi,
    Can somebody guide me in changing the background color of a row when its being selected. In my ADF table, one of the column is of type Command Link. So whenever i click this command link on any particular row that complete row color should change as an indication of that row being selected.
    Please guide me to do this. I referred to other forum posts, but they couldnt meet my need.
    Thanks
    ri

    Hi Frank,
    you're right. This should work. But the result is not perfect from my point of view.
    I use
    <af:table ...>
      <af:column ...>
        <af:outputText value="#{row.col1}" inlineStyle="#{row.mystyle}"/>
      </af:column>
    </af:table>and I get e.g. this in HTML:
    <table ...>
      <tr>
        <td class="af_column_cell-text OraTableBorder1111"><span style="font-weight:bold;">qqq</span></td>
      </tr>
    </table>while I would prefer to get somethig like this:
    <table ...>
      <tr>
        <td style="font-weight:bold;"><span>qqq</span></td>
      </tr>
    </table>, which looks much smarter. Is it possible?
    Thanks,
    Alexandre.

  • Different Background Colors for Clients

    Maybe this isn't the right forum for this but how do you change the background color of ECC to change based on the client you select?

    Hello,
    As far as I know the colour settings are user based. On the top of SAP screen you will have a button with options, where you can change colour of the screen. If you want to get the colour of the screen based on the SAP, please speak to basis team and they should able to help you out.
    Regards,
    Ravi

  • Set background color to selected jtable columns cell

    I am clicking on jtables column.I want to select any column and that column (only selected cell of column)should get displayed with specific background color.
    plz help

    You can write your own tablemodel,
    i.e. use DefaultTableModel or implement AbstractTableModel.
    Good luck!

  • How do I change the colors of Ring texts individually so when it pulls down, I can see each test with different background color?

    I have been using LabView for a almost 18 months now. There was no problem which I could not solve with help of all resources available. But, this is one where I am scratching my head since long time now.
    I would like to change colors of each individual text in Ring control programmatically. I have attached example VI. In this VI, I change background color of ring text, but it changes only the current (active) background color, so when you pull down the whole menu, it shows same default color for all the text background (not even the color I asked it to). Is there anyway I can define individually as to what color should be related to each text in ring menu?
    Attachments:
    Ring Menu Colors.JPG ‏16 KB
    RGB Ring.vi ‏33 KB

    " Is there anyway I can define individually as to what color should be related to each text in ring menu?"
    Well not with a ring and not programatically.
    The best I can suggest is a picture ring, see below.
    Ben
    Message Edited by Ben on 11-18-2005 02:16 PM
    Ben Rayner
    I am currently active on.. MainStream Preppers
    Rayner's Ridge is under construction
    Attachments:
    Picture Ring.JPG ‏5 KB

  • Pseudoclasses:How to apply different link colors in two separate table cells

    How do I add the link state styles for these two cells?
    Footer table is in an include file
    Current code is:
    <table width="800" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr>
        <td class="tdfooter1"><a href="index.php">Home</a>  |  <a href="about.php">About Our Company</a>  |  <a href="clients.php">Our Clients</a>  |  <a href="partners.php">Our Partners</a> |  <a href="contact.php">Contact Us</a></td>
      </tr>
      <tr>
        <td class="tdfooter2">Copyright 2010 by Data Carpet &amp; Rug   |  <a href="terms.php">Terms Of Use</a>  |  <a href="privacy.php">Privacy Statement</a></td>
      </tr>
    </table>
    Current CSS is:
    .tdfooter1 {
        font-family: Tahoma;
        font-size: 12px;
        color: #FFFFFF;
        background-color: #666666;
        text-align: center;
        height: 30px;
    .tdfooter2 {
        font-family: Tahoma;
        font-size: 12px;
        background-color: #CCCCCC;
        text-align: center;
        text-transform: capitalize;
        height: 30px;
    Ran out of variations, and any assistance will really be appreciated

    .tdfooter1 a:link {...
    .tdfooter1 a:visited {...
    .tdfooter1 a:hover {...
    .tdfooter1 a:active {...
    .tdfooter2 a:link {...
    .tdfooter2 a:visited {...
    .tdfooter2 a:hover {...
    .tdfooter2 a:active {...

Maybe you are looking for

  • How to get back from Show form  to Render List  form in XML Forms

    Hi, As we use the Hyperlink "Display" in RenderList form to go to Show form similarly what kind of hyperlink shoul we use in Show Forms to get back to RenderList Forms. We did try out with the Back option but are not getteing the desired result. Swet

  • CompileCommand for Weblogic 6.0

              My JSP pages are failing Weblogic 6.0 with the error           Couldn't find init param: compileCommand           Any ideas why?           

  • Send XML file to Webservie datasource without XI - Urgent

    Hi, Can anyone send me the JAVA or .Net code to send the XML file to Webservice data source. I have tested it with Navigator test pagae and it works fine. Kindly send me the piece of code to trigger the webservice,since i am not good at JAVA. Thanks,

  • Serialization without writing it in a file

    I need to serialize array of object. I can't use the file to store my serialized objects. I am trying to use ByteArrayOutputStream() for this purpose. I have the follwoing doubts: 1) Can i write the array object as a one object or do i need to write

  • My i pon is not connected on pc wit i tune

    my ipon 4s not connected wit itunes just showing charging but not working ,,,,but import pics n videos