Inline-flex爲元素添加了額外的垂直空間

所以我拼湊了一個簡單的基於材質的開關類，它使用flex來進行間距。一切運作良好，但是，當我製作一些佈局變體時，我得到了一些意想不到的間距。Inline-flex爲元素添加了額外的垂直空間

See codepen example

正如你所看到的例子，左邊的列有更多的垂直間距比右邊的列。它對我來說沒有意義，因爲我所做的全部都是重新安排了跨度。

我知道它與切換到常規彈性修復問題時內聯有關。但是內聯間距（如font-size：0和line-height 1）的正常技巧似乎沒有任何區別。

來源

2016-06-28 user3749692

問題尋求幫助調試必須包括必要的重現它最短的代碼**在問題本身NB ** - **請不要濫用代碼塊來解決此需求**。 –

請不要在外部網站上發佈代碼（可能會失敗），請在[內嵌最小，完整，可驗證的示例]（// stackoverflow.com/help/mcve）中，最好以[Stack Snippet ]（// blog.stackoverflow.com/2014/09/introducing-runnable-javascript-css-and-html-code-snippets/）。 –

您需要的10px的高度增加

.pv-switch__switch

Example Pen

來源

2016-06-29 12:00:55

Inline-flex爲元素添加了額外的垂直空間

回答

相關問題