<figure>增加了不必要的邊距/填充

Question

我一直在嘗試使用<figure> -element。到目前爲止這麼好，希望它會讓我的網站更多的搜索引擎優化。

但是！有這個東西，它增加了額外的邊距/填充（儘管它們都被設置爲margin:0; padding:0;）。這不是<figcaption>，因爲它位於<figure>內的<img>之上。

任何人都可以解釋我如何解決這個問題嗎？經過一番研究後，我知道如果用常規的<div>代替<figure>，它的行爲會正常。但是，根本不需要<figure> -element。

，一種在要求它的那些小小提琴：https://jsfiddle.net/jn2geLmy/1/

Answer 1

應設置figure S的內部的相似圖片爲block像這樣：

display: block; 

刪除不需要的餘量。看到這個fiddle

Answer 2

在圖中的圖像中添加display:block。

Fiddle