DITA and XMetaL Discussion

XMetaL Community Forum DITA and XMetaL Discussion DITA Editor style – add a background image?

  • leo71

    DITA Editor style – add a background image?

    Participants 2
    Replies 3
    Last Activity 9 years, 3 months ago

    XMetal Version#: 8.0.0.036

    I have custom note types and to make it clear the right note type is selected I would show the note image.

    C:Program Files (x86)XMetaL 8.0AuthorDITAXACs1.2ditabaseditabase-base-override.css
    [class~=”topic/note”] {
    background: url('../../shared/images/demo.png') no-repeat scroll 0 0 transparent;
    }

    or background-image: url('demo.png');

    I tried several options, but don't know if there is some sort of limitation, disabling image backgrounds at all.

    The XMetal example having the yellow background worked fine, so I am editing the right file and class.

    Reply

    mag3737

    Reply to: DITA Editor style – add a background image?

    XMetaL doesn't support the “background” or “background-image” properties.

    You can do an image with the :before pseudo-selector:

    [class~=”topic/note”]:before
    {
    content: url('note.gif');
    }

    [class~=”topic/note”][type~=”tip”]:before
    {
    content: url('tip.gif');
    }

    But I can't see an obvious way to get BOTH the image and a text label such as “Note” or “Tip”. Simply putting both in the content: property didn't do it. Maybe Derek knows …

    Reply

    Derek Read

    Reply to: DITA Editor style – add a background image?

    This is supported:
    content: "some text " url('tip.gif');

    This is not supported:
    content: url('tip.gif') " some text";

    Reply

    leo71

    Reply to: DITA Editor style – add a background image?

    Thank you very much.

    This works very well. It must just provide the user feedback that they have entered the right othertype note.

    Perfect!

    Reply

  • You must be logged in to reply to this topic.

Lost Your Password?

Products
Downloads
Support