How can I place images side-by-side in restructured text?

Question

Is there a way to put 2 different images on the same "line", so, side-by side?

I know there is the :align: option, but if I put two images, the first with :align: left and the second with :align: right it doesn't work, because the latter is put in another paragraph.

score 38 · Answer 1 · answered Mar 01 '17 at 02:19

38

I used substitution definitions:

|pic1| any text |pic2|

.. |pic1| image:: img1.png
   :width: 45%

.. |pic2| image:: img2.png
   :width: 45%

answered Mar 01 '17 at 02:19

fiona

681
5
9

1

The blank newlines in the above answer have to be there. Just tried it without those and it doesn't give the expected output. – akshaynagpal May 17 '17 at 11:59

score 13 · Answer 2 · edited Jun 14 '19 at 09:07

13

.. list-table:: 

    * - .. figure:: ../_static/1repren.png

           Fig 1. Representations

      - .. figure:: ../_static/5transparency.png

           Fig 2. Transparency
    * - .. figure:: ../_static/9ele.png

           Fig 3. Electrostatics

      - .. figure:: ../_static/11R3D.PNG.png

           Fig 4. R3D

edited Jun 14 '19 at 09:07

barbsan

3,418
11
21
28

answered Jun 14 '19 at 08:45

autolife autolife

151
1
4

score 8 · Answer 3 · answered Jul 13 '16 at 18:31

You want the images to be part of the same paragraph and you want them to split the width of the screen so do something like this:

.. image:: im1.jpg
    :width: 50 %
.. image:: im2.jpg
    :width: 50 %

This doesn't exactly work, there will be some spacing between the 2 images which will put the total width >100%. A simple workaround is setting the widths to 49%. Doing so, below is the output with the unformatted image above to compare: RenderedImages

More reading: reST docs on Images

score 1 · Answer 4 · answered Jul 09 '21 at 11:13

1

To make this snippet (mentioned above by @fiona) work you need to declare | pic | before referencing it.

.. |pic1| image:: img1.png
   :width: 45%

.. |pic2| image:: img2.png
   :width: 45%

|pic1| any text |pic2|

answered Jul 09 '21 at 11:13

martutittu

61
3

No, you don't need to declare pic1 and pic2 before using them. The other answer is fine. – mzjn Dec 16 '22 at 11:01

score -6 · Accepted Answer · answered Mar 03 '14 at 14:50

-6

Try this:

.. class:: center

This text is centered

answered Mar 03 '14 at 14:50

Pierre Nortje

716
3
8
29

10

It doesn't work for me. Can you explain a bit further how this works? That `.. class:: center` goes before both `.. image::`s? – José Ramón Dec 23 '15 at 14:11

How can I place images side-by-side in restructured text?

5 Answers5

Linked