I'm wondering if Netsurf CSS supports these commands (if that's the
correct term)
display:table or width:min-content
Netsurf's online documentation for development progress says the CSS
"display" category is complete, but I can't seem to get this
particular display function to perform.
What I'm struggling to achieve is to use the <figure> and <figcaption>
tags to produce a caption under a photo. This works fine as long as
the caption is a single line. But if the caption text is longer,
you'd think it would simply flow to a new line under the picture but,
no, it fills the width of the whole page before it breaks to a new
line.
See examples: http://archivemag.co.uk/TEMP/Netsurf-figure/ . The main
part of the page is a tutorial (from my son); my attempts are added at
the bottom.
* The page "works-but-uses-BR.html" nearly shows the result I want --
picture and caption at the right of main story, which starts at top of
page alongside the picture. But take out my bodged <br> tags and see
what happens.
* The "tablecaption-X.html" page fails (see (3) below).
Multi-line captions are so common (look at any magazine or newspaper)
that I'm surprised that CSS doesn't have a simple built-in standard
for them.
Obviously whatever approach I settle on, I want it to suit Netsurf as
well as mainstream browsers.
The idea for using display:table came from an online search:
(1) https://stackoverflow.com/questions/6534473/how-can-i-make-the-wid
th-of-my-figcaption-match-the-width-of-the-img-inside
(2) https://stackoverflow.com/questions/10264463/can-a-figcaption-be-r
estricted-to-the-width-of-a-responsively-sized-image
The third idea uses table:caption; caption-side:bottom; -- again,
does Netsurf support it? In my attempts the caption lands at the
right of the picture, not beneath it. (See "tablecaption-X.html".)
(3) https://www.sitepoint.com/community/t/how-to-force-this-figcaption
-element-to-respect-its-parents-width-boundaries/30025
(Unforch this link stymies Netsurf but try e.g. Firefox or Android.)
A promising idea in (1) is width:min-content -- a value for width
used in the reply at https://stackoverflow.com/a/28341085/496046
that is apparently new, according to documentation at
https://developer.mozilla.org/en-US/docs/Web/CSS/width#min-content --
does Netsurf support this?
--
Jim Nagel www.archivemag.co.uk
|| See you at the show? www.riscos-swshow.co.uk Feb 24
