javascript - 设置边框时div跳转

Question

当用户单击 div 时（请参见下面的附加屏幕截图），我正在设置边框：

$div.addClass("selected-block");

在 CSS 中，我有：

div.selected-block {
   border: 2px solid #155BCE !important; 
   border-radius:3px;
}

设置好边框top和left增加文字后3。如何避免这种情况？

PS。我想为取消选择的 div 制作白色边框，但这不是一个好的解决方案，因为白色边框可以与黑色线条相交。

Answer 1

用于 css3 box-sizing 属性

像这样

div.selected-block{
box-sizing:border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
}

Answer 2

以 2px 透明边框开始元素，然后更改边框颜色。

div {
   border: 2px solid transparent; 
   border-radius: 3px;}

div.selected-block {
   border-color: #155BCE; 
}