Jupyter-book: (responsive) Side by side figures?

[YannDubs]

Is there any way to have figures or images side by side ? Even better if they are side by side in large screen but collapse to 2 rows on smaller screens :) That would be great!

I tried using a table but couldn't put a MyST figure in the cells + it wouldn't look nice due to the grids

Thanks so much for the repo, I'm loving it 💯

[choldgraf]

hmmmmm that's a good question. I wonder if this would be possible with some CSS over-rides? Or you could try to use something like a table to organize it in this way?

[chrisjsewell]

Hey @YannDubs this is issue is similar to #793.
However, since you mention responsive layouts, I would also check out https://sphinx-panels.readthedocs.io

I tried using a table but couldn't put a MyST figure in the cells

The other existing (semi) solution would be to use https://docutils.sourceforge.io/docs/ref/rst/directives.html#list-table, something like (not tested).

` {list-table} Caption
:header-rows: 1

• 
  
  • Sub-caption 1
  
  
  • Sub-caption 2
  
  
• 
  
  • 
  
  
  • 
    
    ````
    
    `````
  
  

[choldgraf]

Oops - yes that's what I meant by my table recommendation above (using a list-table) I just forgot to say it haha. That's how I insert more complex things into a table structure.

[YannDubs]

Awesome, sphinx-panels is exactly what I was looking for. Thanks to both of you.

Here's what I'm using in case someone needs it in the future:

~~~
````{panels}
:container: container-fluid
:column: col-lg-6 col-md-6 col-sm-6 col-xs-12
:card: shadow-none border-0

```{figure} example1.png
:width: 100%
:name: example1

Sub-caption 1

```{figure} example2.png
:width: 100%
:name: example2

Sub-caption 2

````
~~~

[choldgraf]

@chrisjsewell we should use examples like these in some demo books! Maybe @najuzilu can find a way to work em into quantecon 😊

[chrisjsewell]

Oh yeh I'm always for more use of sphinx-panels 😁

[najuzilu]

@choldgraf great idea!