使用“邊距/填充”在沒有“位置”屬性的情況下實現絕對定位

Question

我正在構建基於電子郵件的HTML。 現在我們知道，電子郵件客戶端中不很好地支持Position屬性，因此我必須繼續這樣做。 現在，看一下我的選擇...我可以選擇邊距或填充來定位元素。 輸入元素可以相對定位或絕對定位。 我現在只做絕對的一部分。 所以，我的輸入例如

One Parent DIV (top:0, left:0)
A Child DIV (top:20, left:20)
Second Child DIV (top:20, left: 200)

現在，在基於普通瀏覽器的HTML中，這些元素將很容易放置在其適當的位置。 但沒有position: absolute或什至頂部，左側屬性。 由於margin屬性將元素相對於其他元素進行排列比較棘手。 這是一個示例運行：

<div style="width: 600pt; height: 600pt; border:2px solid red; margin-left:20pt; margin-top: 30pt">
    <div style="width: 100pt; height: 100pt; border:2px solid black; margin-left:20pt; margin-top: 30pt"></div>
    <div style="width: 100pt; height: 100pt; border:2px solid black; margin-left:20pt; margin-top: 30pt"></div>
    <div style="width: 100pt; height: 100pt; border:2px solid black; margin-left:20pt; margin-top: 30pt"></div>
</div>

小提琴

我的預期結果是，所有黑色div彼此重疊，放置在同一位置。 如果它根據“父元素”計算邊距，但從上一個元素的父元素到頂部的左邊距，則有可能。

所以，我現在的問題是，有沒有一種方法可以使用marging-left，top作為top，left屬性並產生與position：absolute相同的行為？ 或者簡單地，使用margin或padding屬性將這三個元素放在頂部（無位置，因為電子郵件客戶端不支持）

我也知道，將Divs用於電子郵件不是最好的方法，我應該考慮使用表格，但請相信我，我正在處理的HTML類型只能使用Divs以及一些邊距或填充來生成。 任何幫助將不勝感激。