我正在尝试使
以下代码源自此答案,它可以在IE 11和Edge 15中正常工作,但在Firefox 55和Chrome 61中无法正常工作:
<figcaption>
元素在其内容宽度超过<img>
同级元素的宽度时呈现滚动条,通常是当内容为长URL或非常长的单词时。以下代码源自此答案,它可以在IE 11和Edge 15中正常工作,但在Firefox 55和Chrome 61中无法正常工作:
* {
outline: 1px solid red;
}
figure {
display: table;
max-width: 100%;
}
figure img {
vertical-align: top;
}
figure figcaption {
display: table-caption;
caption-side: bottom;
overflow: auto;
}
<figure>
<img src="//via.placeholder.com/220x100" alt="">
<figcaption>Long word in figure caption Lopadotemachoselachogaleokranioleipsanodrimhypotrimmatosilphioparaomelitokatak</figcaption>
</figure>