使用CSS的表單元格間距

是否可以在單元格之間添加間距？使用CSS的表單元格間距

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <title>test</title> 
    <style> 
    #wrap { 
    display: table-row; 
    /* there is no also cellspacing in CSS afaik :(*/ 
    } 
    #wrap div { 
    display: table-cell; 
    /* margin: 40px; doesn't work for table-cell :(*/ 
    /* border: 30px solid transparent; works but it's as good as adding padding */ 
    /* border: 30px solid white; works but the page background is invisible */ 

    /* decoration: */ 
    background-color: green; 
    padding: 20px; 
    } 
    </style> 
</head> 
<body> 
    <!-- don't touch the markup --> 
    <div id="wrap"> 
    <div>text1</div> 
    <div>text2</div> 
    </div> 
</body> 
</html>

來源

2010-03-26 antpaw

可能重複的[如何在CSS中設置cellpadding和cellspacing？]（http://stackoverflow.com/questions/339923/how-to-set-cellpadding-and-cellspacing-in-css） – user 2014-03-07 20:42:30

使用margin屬性：

#wrap div { 
background-color:green; 
float:left; 
margin:10px; 
padding:20px; 
}

如果這不是正是你想要達到什麼樣的，請讓我知道，這樣我可以提供幫助。

編輯：另一種方法是做到這一點：

#wrap { 
border-spacing:20px; 
display:inline-table; 
}

但要注意，邊框間距不完全支持所有瀏覽器（IE6 IE7 &不支持）。

來源

2010-03-26 09:28:02 o15a3d4l11s2

我喜歡你的第一個解決方案「border-spacing」更好，因爲float會讓我陷入清晰的地獄。太糟糕了，沒有「border-spacing-left」 – antpaw 2010-03-26 09:42:15

保證金不適用於顯示爲表格單元格的項目。如果用戶想要構建一個可變的N行項目並自動填充它們，則需要使用表格單元格，直到新的CSS功能得到廣泛支持。在這種情況下，只有你的第二個答案適用，如果你能澄清這一點，這將是非常好的。 – Brent 2013-07-24 19:37:49

使用CSS的表單元格間距

回答

相關問題