爲什麼這些像素等效元素具有不同的實際大小？

我試圖編寫博客，我想同步時間軸事件和它的帖子的位置。我將它編碼爲兩個不同的列，我試圖用jQuery獲得帖子的高度，然後計算時間軸事件中空白的大小。一切似乎都設置好了，控制檯給了我相當於數字，所以程序員工具在Chrome中。你可以看到帖子here的高度，這些都是它旁邊的元素的高度：element1，element2，element3。總共740像素，但主要元素後也是740像素。爲什麼這些像素等效元素具有不同的實際大小？

所以，我想知道，這怎麼可能？謝謝。

來源

2017-11-04 Marcel Jurišta

那張照片是毫無價值！無論如何...當計算元素的高度時，你是在談論內容框高度，填充框高度，是否有任何內容的頂部/底部邊距？ –

對不起圖片。無論如何，感謝您的評論。我想到了！我不得不減去時間線上元素的邊距。謝謝！祝你今天愉快。 –

正如你可以在圖片中看到，保證金不包括在大小。所以，例如，雖然這個「G +」圖標可能是32x32，並帶有邊距，但它可能會接近48x48。而文章的高度只是指綠線（填充）。

有可能解決這個，但使用你現在在做什麼，如果你在包裝的div的保證金間隔元素的多種方式，那麼這些包裹div一定有正確的大小本身。

來源

2017-11-04 00:59:11 SamVK

很好的解決方案，謝謝你們！ –

爲什麼這些像素等效元素具有不同的實際大小？

回答

相關問題