1

我正在尝试创建一个日历，其中每天都有一个框，以小边距分隔。问题：未应用边距。我在日期周围添加了红色边框，正如您在代码中看到的那样，边框之间没有边距。我删除了所有无关的 CSS，甚至临时添加了一个!important属性（我讨厌，想想我有多绝望），无济于事。我绝对看不出我做错了什么，所以任何帮助表示赞赏。

代码在这里。


编辑
我添加了hrunting的答案中提到的代码

#calendar table {
  border-collapse: separate;
  border-spacing: 2px 2px;
}

到我的代码，但它似乎没有任何区别。（我删除了红色边框。如果您有单独的日期框，您应该看到它何时起作用。）

4

2 回答 2

1

在此处阅读此 StackOverflow 答案。

基本上，内部表格元素没有应用边距（并且填充不是您想要的，因为该间距位于边框内部，而不是外部）。您需要将属性与属性border-spacing一起使用border-collapse才能获得所需的外观。

此外，从您的定义中删除cellspacing=0HTML 属性。<table>

于 2013-02-03T13:28:27.147 回答
0

表格单元格不能直接应用边距。您可以在此处阅读表格规范：http: //www.w3.org/TR/CSS2/tables.html并查看表格单元格有自己的盒子模型。您可以像@Praveen 建议的那样添加填充，但填充有限制。例如，如果您想增加不起作用的边界之外的空间。填充实际上增加了单元格内的空间，因此具有不同的效果。

这个问题可能重复：CSS Cell Margin

取自那个问题：

那么什么是“正确”的方式呢？如果您正在寻找替换表格的 cellspacing 属性，那么可以替换边框间距（禁用边框折叠）。但是，如果需要每个单元格的“边距”，我不确定如何使用 CSS 正确实现。我能想到的唯一技巧是使用上述填充，避免单元格的任何样式（背景颜色、边框等），而是在单元格内使用容器 DIV 来实现这种样式。

于 2013-02-03T13:32:16.910 回答