How to lay 2 images side by side in html?
<p>This is my current code:</p>

<pre><code>&lt;figure class="half"&gt;
    &lt;img style="width:400px" src="http://alexmarshall12.github.io/assets/img/colored_1693146.png"&gt;
    &lt;img style="width:600px" src="http://alexmarshall12.github.io/assets/img/one-piece-1693146_colored2.png"&gt;
    &lt;figcaption&gt;Caption describing these two images.&lt;/figcaption&gt;
&lt;/figure&gt;
</code></pre>

<p>Unfortunately perhaps because the images are too wide, it still puts the second image on the next line. I want to avoid this - no matter how wide things get. How can I do this? </p>