image align and margins

[wrobell]

Describe the bug
In long description of a project, an image is specified with

.. image:: https://gitlab.com/wrobell/remt/raw/master/examples/rm.png
   :align: center

Unfortunately, the image is not centered. Also, there is no margin between the image and the preceding paragraph.

Expected behavior

1. The image is centered.
2. There is an appropriate margin between the image and preceding paragraph.

To Reproduce
Please see bottom of the following page https://pypi.org/project/remt/.

My Platform
Browser: Chrome/Chromium

[mila]

I will look into this.

[nlhkabu]

Assigned to @mila at the EuroPython sprints :)

[mila]

See pypa/readme_renderer#112 for a root cause.
If that's fixed, we can add styles .align-{left,right,center} classes.

[di]

@mila The new version of readme_renderer will get deployed in a bit once #4717 is merged, are you able to add the necessary styles once that happens?

[mila]

The styles should be already present. Merged in #4391.

[dstufft]

I'm reopening this issue, because the code in readme-renderer that was merged as a result of pypa/readme_renderer#114 isn't actually going to work in all (most?) cases due to the reliance on the inline style attribute, which Warehouse blocks from working using our CSP policy, which we won't be relaxing.

readme_renderer will need to emit css classes instead of inline styles in all casses.

[dstufft]

Actually going to close this again, since it was pointed out in pypa/readme_renderer#112 (comment) that this issue was about alignment, which is using classes, not about sizes which does not.