General XMetaL Discussion

XMetaL Community Forum General XMetaL Discussion Image as a bullet using CSS

  • pooh2583

    Image as a bullet using CSS

    Participants 4
    Replies 5
    Last Activity 8 years, 11 months ago

    Hello,

    I have to use an image asa bullet for specific element in XMetal,I am writing following code for the same

    element {
    display:list-item;
    margin-left:10pt;
    list-style-image: url(small.png);
    }

    and I have put image small.png in BUildproject folder as well as folder out side Builproject where .css file exists.
    but this code doesn't work.

    Is there any way I can acheive this functionality.

    I am using Xmetal Author 7.0

    Regards

    Reply

    Derek Read

    Reply to: Image as a bullet using CSS

    The list-style-image property is not supported.

    I think the closest you can get to what you want is to use an element:before selector together with content:url(small.png);

    Reply

    pooh2583

    Reply to: Image as a bullet using CSS

    Hi Derek,

    I used you suggested method  and copied the image small.png(tried small.bmp as well) in BUildproject folder as well as folder out side Builproject where .css file exists.

    now imge is present but with X symbol , it seems there is some problenm with the path provide in url.

    could you please let me know where excatly I need to put the image so that I can use it in the css

    content:url(small.png);

    Reply

    Derek Read

    Reply to: Image as a bullet using CSS

    Given the CSS that you quote in your latest message the image needs to be in the same folder as your CSS file. Relative paths are relative to the CSS file.

    If it is already there then maybe you've found a form of PNG image that XMetaL has trouble rendering. Try another image type to test that, such as JPG or GIF. PNG images are supported but I believe our rendering engine is not 100% up to date on the latest PNG format.

    Reply

    pooh2583

    Reply to: Image as a bullet using CSS

    Hi Derek,

    I have used all the file formats but image is not visible only cross is visible inpalce of an image.

    Regards

    Reply

    Derek Read

    Reply to: Image as a bullet using CSS

    In this case you have a path problem.

    If you are using an XAC file to distribute your customizations you will need to make sure the image is in the XAC so that it is unpacked at the same location as the CSS file. If it were me I would avoid using the XAC file format in this case and distribute your customization as separate files (DTD, CSS, CTM, MCR, etc). The XAC file is used if found so make sure it isn't there.

    Reply

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

Lost Your Password?

Products
Downloads
Support