边界上表元素悬停搞乱标准宽度/高度

Question

所以我有一个表（日历），并有在每个td元素的CSS悬停。我把这个悬停边框，但它搅乱了细胞的宽度和高度（即新的边界将推动下一行稍微再往下等）

解决这个什么方法？

Answer 1

你可以（如果悬停没有通过过渡平滑）有一个填充框（可以说5px）和悬停你可以添加2px的边框和填充3px，所以它仍然是与距框的末端5px距离。

Answer 2

你可以通过在与td背景具有相同颜色的所有td元素上使用边框并只改变边框的颜色（而不是宽度）来获得与最初设计的效果非常相似的效果不会弄乱宽度和高度。

原来的边框是用户看不到的，因为它的颜色背景颜色相匹配。

Answer 3

CSS是臭名昭著的这样做，因为“边界”的属性不会添加到对象的总高度。它表现得像利润率。你可以做的是几保证金规则，在你的CSS文件添加到您的<TD>选择：

td.hoverable { 
    border:1px solid #00F; 
    margin:-1px; 
} 

所以，当你徘徊，新的“保证金”的规则也生效，从而减少面积<td>由1px，这应该允许边框显示。

编辑：哎呦，不错。我的意思是margin:-1px; :)谢谢！