Test /

2016Skin

images (with no white border) having white margin in between, and caption under second image is lower down than should be. There should be no margin space between images and between image and caption (compare with PmWiki skin here ImageMarginTest?skin=pmwiki)

caption text

Just text after the picture.

Pictures one next to another:

This is a paragraph with inline pictures.

baseline alignment

alignment bottom, not baseline

I suggest to use css: div.img img:only-of-type { vertical-align: bottom; } but this will still also apply for a line with single image followed by text, as last sample shows. PmWiki does not wrap these into <p> tags, the text is just in the div wrapping the image. How do we catch these? HansB

Here is hack, adding &zwj; before image forces image and text to be in paragraph, not separate div. It has desired effect, but not nice to hack like that. Question is: could perhaps the image markup be changed, so an image at the beginning of a line, followed by more inline content, and not a caption, will hav ethe line wrapped as p pargraph text?

‍ alignment baseline using zero-width character insertion hack

from comments on Stackoverflow about this HTML5 ? problem:

This problem is caused by the image behaving like a character of text (and so leaving a space below it where the hanging part of a "y" or "g" would go), and is solved by using the vertical-align CSS property to indicate that no such space is needed. Almost any value of vertical-align will do; I'm fond of middle, personally.

The problem is caused by vertical-align: baseline, which is the default for most elements and indicates that that space should be reserved. Some of the other legal values for vertical-align also reserve this space, but top, text-top, middle, bottom and text-bottom do not. sub also doesn't appear to, but I'm leery of trusting that one.

(source)

TEST INDENT

START test hanging text. test hanging text. test hanging text. test hanging text. test hanging text. test hanging text. test hanging text. test hanging text. test hanging text. test hanging text. test hanging text. test hanging text. test hanging text. test hanging text.

OUTDENT is too left.

TEST INDENT

OUTDENT is too left. test hanging text. test hanging text. test hanging text. test hanging text. test hanging text. test hanging text. test hanging text. test hanging text. test hanging text. test hanging text. test hanging text. test hanging text. test hanging text. test hanging text.

TEST INDENT

Inline shorter code.escaped code here ~~appears to move up~~ fixed.

Inline code.escaped, no linebreaks inside: I would suggest to add code and non escaped lines an overflow : auto; property I would suggest to add code and non escaped lines an overflow : auto; property I would suggest to add code and non escaped lines an overflow : auto; property .

Line starting with white space:

 I would suggest to add code and non escaped lines an overflow : auto; property I would suggest to add code and non escaped lines an overflow : auto; property I would suggest to add code and non escaped lines an overflow : auto; property

Pre (contains linebreaks):

Test
I would suggest to add code and non escaped lines an overflow : auto; property I would suggest to add code and non escaped lines an overflow : auto; property I would suggest to add code and non escaped lines an overflow : auto; property

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.