OASIS Mailing List ArchivesView the OASIS mailing list archive below
or browse/search using MarkMail.


Help: OASIS Mailing Lists Help | MarkMail Help

docbook-apps message

[Date Prev] | [Thread Prev] | [Thread Next] | [Date Next] -- [Date Index] | [Thread Index] | [List Home]

Subject: Re: When using standard DocBook XSL SVG icons for HTML output, how can the width be specified?


For anyone who has the same requirement and finds this by searching
mail archives, here's the solution I chose:

a.co > img, div.calloutlist a > img[src*="/callouts/"] {
  width: 14px;
  height: 14px;

The [...] CSS3 selector might be troublesome on some older browsers
but it works for me.  It can be dropped, but might just map onto the
wrong image if you've heavily customized your CSS or XSL.  Probably OK
in almost all cases.

Hope that helps,

On 29 August 2012 11:59, Christopher BROWN <brown@reflexe.fr> wrote:
> Hello,
> I'm using DocBook XSL 1.76.1 with Xalan and FOP, and would like to use
> SVG icons for callout bugs.
> Using "callout.graphics.extension", I can specify ".svg" and it
> works... except that the icons ares HUGE, so that's not going to work.
>  I looked for a "callout.graphics.width" parameter but it looks like
> that's not provided for with the standard "html/callout.xsl" template
> (the template "callout-bug" doesn't set the width or height
> parameters).
> Why am I trying to switch to SVG?  Because I now have to target HiDPI
> screen users (read: MacBook Pro users with "Retina" screens) and the
> upscaling of the PNG images looks pretty awful beside the "paper
> quality" text.
> Would it make sense to modify the XSL and add "callout.graphics.width"
> as an XSL parameter?
> Or will I just have to write some CSS rules, for example something like:
> a.co > img, div.calloutlist a > img {
>   width: 12px;
>   height: 12px;
> }
> The second selector might map onto the wrong "img" tags though as it
> doesn't have any class.  I suppose I could try my luck with
> img[src*="/callouts/"] but I'm not sure I can try my luck with that
> CSS3 selector yet...
> Thanks,
> Christopher

[Date Prev] | [Thread Prev] | [Thread Next] | [Date Next] -- [Date Index] | [Thread Index] | [List Home]