doc/bugs/footnotes-look-weird.mdwn

   1 Multimarkdown footnotes are pretty useful. If they are enabled in a
   2 wiki, they don't look so good with the default stylesheet, however, as
   3 the references are in the same size and positioning as everything
   4 else.
   5
   6 This particular wiki does not use multimarkdown, so there's no easy
   7 way to demonstrate this here, you'll have to trust me on this. :)
   8
   9 The following stylesheet should be added to `style.css`:
  10
  11     a.footnote { vertical-align: super; font-size: xx-small; }
  12     div.footnotes { font-size: small; }
  13
  14 This is a typical style that user-agents apply to the `<sup>` tag. For
  15 example, chromium has this builtin style for `<sup>`:
  16
  17     vertical-align: super;
  18     font-size: smaller;
  19
  20 Bootstrap uses this instead:
  21
  22     sup {
  23         top: -.5em;
  24     }
  25
  26     sub, sup {
  27         position: relative;
  28         font-size: 75%;
  29         line-height: 0;
  30         vertical-align: baseline;
  31     }
  32
  33 I settled on `xx-small` because it's the only size that doesn't affect
  34 line-height here. However, Bootstrap's way may be better.
  35
  36 At any rate, the correct way to fix this is to *avoid* custom styling
  37 and use the `<sup>` tag for the footnote reference, as it has
  38 *meaning* which is important to have proper semantic output (e.g. for
  39 screen readers), as detailed in [this Stack Overflow discussion][].
  40 --[[anarcat]]
  41
  42 [this Stack Overflow discussion]: http://stackoverflow.com/questions/501671/superscript-in-css-only
  43
  44 > ikiwiki code does not interpret Markdown or translate it into HTML.
  45 > If I'm interpreting what you say correctly, you seem to be implying
  46 > that you think [[!cpan Text::MultiMarkdown]] is producing incorrect
  47 > HTML for footnotes (is an `<a>` with a `class`, should be a `<sup>`).
  48 > If so, please report that as a MultiMarkdown bug, not an ikiwiki bug,
  49 > or alternatively don't use MultiMarkdown.
  50 >
  51 > What remains after eliminating the MultiMarkdown bug seems to be:
  52 > ikiwiki's default stylesheet does not contain the necessary styling
  53 > to work around the non-semantic markup produced by the non-default
  54 > Text::MultiMarkdown Markdown implementation. Is that an accurate
  55 > summary?
  56 > --[[smcv]]
  57
  58 Note that I also make the bottom `<div>` small as well so that it has
  59 less weight than the rest of the text. -- [[anarcat]]