General XMetaL Discussion
XMetaL Community Forum › General XMetaL Discussion › Image as a bullet using CSS
-
pooh2583 October 10, 2013 at 10:53 am
Image as a bullet using CSS
October 10, 2013 at 10:53 amParticipants 4Replies 5Last Activity 9 years, 3 months agoHello,
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
Derek Read October 10, 2013 at 7:17 pm
Reply to: Image as a bullet using CSS
October 10, 2013 at 7:17 pmThe 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);
pooh2583 October 11, 2013 at 11:57 am
Reply to: Image as a bullet using CSS
October 11, 2013 at 11:57 amHi 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);
Derek Read October 11, 2013 at 8:05 pm
Reply to: Image as a bullet using CSS
October 11, 2013 at 8:05 pmGiven 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.
pooh2583 October 14, 2013 at 12:42 pm
Reply to: Image as a bullet using CSS
October 14, 2013 at 12:42 pmHi Derek,
I have used all the file formats but image is not visible only cross is visible inpalce of an image.
Regards
Derek Read October 16, 2013 at 9:05 pm
Reply to: Image as a bullet using CSS
October 16, 2013 at 9:05 pmIn 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.
-
AuthorPosts
- You must be logged in to reply to this topic.