html - 如何在图像下放置 figcaption

Question

我试图将我的 figcaption 放在 img 下。我不知道为什么它会向右移动。我在页面上还有其他图片，它们的标题没有向右显示，而是在图片下方，但在这张图片上，它不在下方，而应该在下方。有人可以帮助我吗？

这是我的 HTML 代码部分:

 figure{
        margin: 0;
    }

    #fig_moje_slike{
        font-size: 9px;
        text-align: left;
        width: 50%;
        margin: 0;
    }

    #sadrzaj{
        display: inline-block;
        margin: 3em auto;
    }

    #sadrzaj ul{
        display: block;
        float: left;
    }

    #sadrzaj ul li{
        margin: 15px 0;
    }

    #slika_mene{
        width: 14%;
        height: auto;
        display: block;
        float: left;
    }

<section id="sadrzaj">
            <aside>
                <figure>
                    <img src="slike/ja.jpeg" alt="slika mene" id="slika_mene">
                    <figcaption id="fig_moje_slike">Moja slika</figcaption> 
                </figure>
            </aside>
            <ul>
                <li>bla bla</li>
                <li>bla bla</li>
                <li>bla bal</li>
                <li>blabla</li>
            </ul>
        </section>

   

结果图片: http://imgur.com/a/XXgsP

Answer 1

从 img 和 figcaption 标签中移除 float: left。而不是将 float 用于 aside 并根据 width，将其用于 aside

https://jsfiddle.net/Ls6coLb7/3/这是更新的 fiddle