div 边距和宽度大小答案

【问题标题】：div margin and width sizediv 边距和宽度大小
【发布时间】：2014-03-09 22:35:42
【问题描述】：

我不擅长 CSS，我想定义 div 位置。

当您单击 div 元素时，我将使用 javascript 将“selected”添加到类中。但是我有一个关于宽度的问题。

我该如何解决？

.insideDiv {
    width: 210px;
    margin : 15px;
    float:left;
    height: 210px;
    overflow: hidden;
    background: no-repeat center center;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}

div.selected {
    border: 5px solid #25a9e6;
}

.container{
    margin: 0px auto;
}

【问题讨论】：

你能解释一下width的问题是什么吗？这将有助于确保您获得所需的答案。

标签： css html width

【解决方案1】：

为 div 添加一个 5px 的边框，将 div 的尺寸在每个方向上扩展 5px。我相信您想将box-sizing: border-box; 添加到.insideDiv。这样边框不会改变 div 的尺寸。

【讨论】：

感谢您的回复。

【解决方案2】：

使用 toggleClass 或 addClass

$('.insideDiv').click(function(e) {  
    $(this).toggleClass('selected');
});

这是我的例子Code

【讨论】：

您能否将示例代码或至少相关片段内联在您的答案中。这有助于提高可读性，并确保即使链接失效，答案仍然有用。
当你点击第一个 div 时，另一个 div 会下降。 codepen.io/anon/pen/Djmsi