图像边框延伸到侧面而不是底部

Question

很难解释，但我正在使用：

        <section class="courses">
            <figure>
                <img src="http://atlanta.eat24hours.com/files/cuisines/v4/chinese.jpg" alt="Asian" height="20%" width="20%" />
                <ficaption>Bok choi</figcaption>
            </figure>
    </section>

图标题显示在图像的右侧而不是图像的下方。我使用背景颜色来表示边框的长度： background http://gyazo.com/5c94e96e58d7542da25b25a490a8052e.png 无花果当然也是侧面的。 jsfiddle 我想要它，所以边框延伸到底部，所以图标题正确显示，如下所示： working http://gyazo.com/7e42ff087c19e130c07e6d853f1bafcc.png

Answer 1

插入

<br>

在标题之前

，给图像一个固定的宽度，将图形改为内联块

http://jsfiddle.net/7084ryt3/4/

[编辑]好的，现在我看起来很愚蠢： - ）