Galeria responsive

[gerardrev]

Hola compañeros, estoy haciendo una pequeña web con Bootstrap.
El problema lo tengo con una pequeña galeria de imagenes que necesito.
Necesito una fila de 3 imagenes, con sus 3 pies de foto, y que al cambiar el tamaño de la pantalla, estas 3 imagenes puedan separarse y en la resolucion XS queden una encima de otra, mientras que en LG, MD, y SM queden todas en paralelo.

Para ello he probado dos cosas, la primera declararlo como figure cada imagen y figurecaption para el pie de foto, pero si lo hago así me las muestra siempre una encima de otra, porque le da 100% del ancho de la pantalla.

Tambien he probado de hacer una tabla de 2 filas y 3 columnas, pero claro la tabla es estatica, no cambia de forma al ajustar la pantalla a XS, y si declaro la tabla como responsive entonces pone un scroll horizontal a la tabla.

Alguna sugerencia?
Gracias de antemano

Código HTML:

<h2>Ingletados</h2>
<figure><a id="zoom" title="Ingletado 2 piezas" href="img/cajones/ingletados/3p.jpg"> <img src="img/cajones/ingletados/3p.jpg" alt="" /> <span class="zoom"></span> </a>
             <figcaption class="name" style="padding: 0px"><p>Ingletado 2 piezas</p></figcaption>
            </figure>
            <figure><a id="zoom" title="Ingletado 3 piezas" href="img/cajones/ingletados/3p.jpg"> <img src="img/cajones/ingletados/3p.jpg" alt="" /> <span class="zoom"></span> </a>
             <figcaption class="name" style="padding: 0px"><p>Ingletado 3 piezas</p></figcaption>
            </figure>
            <figure><a id="zoom" title="Ingletado 4 piezas" href="img/cajones/ingletados/4p.jpg"> <img src="img/cajones/ingletados/4p.jpg" alt="" /> <span class="zoom"></span> </a>
             <figcaption class="name" style="padding: 0px"><p>Ingletado 4 piezas</p></figcaption>
            </figure>