Css 引导在行中的列上创建额外的填充

让我先说一下，我对引导比较陌生，可能无法正确理解行/列布局

我正在处理的布局可以在这里看到：（代码粘贴在下面）

右侧的“侧栏”是问题发生的地方。我有一个

.col-md-9

和一个

.col-md-3

包含在

.row

中，但由于某些原因，侧边栏的右侧没有与其容器正确对齐。在玩了一段时间之后，我发现如果我去掉

右边的边距：-15px从
.row
问题消失了，但这肯定不是正确的解决方案，我在这过程中弄糟了一些东西。我的问题是，我的HTML有没有做错什么，或者正确的解决方案真的是手动覆盖
右边距：-15px


HTML

使用：Bootstrap 3.0.3+Jquery 1.10.1
您已经将自定义类
愤怒内容框
与Bootstrap
col-md-3
类组合在一起，并且类上的填充将覆盖Bootsrap网格填充

您只需要像在第一列中一样，将类放在引导程序中的一个单独的
中

<div class="col-md-3">
  <div class="wrath-content-box">
    ...
  </div>
</div>


...

你说得对，谢谢！作为测试，我尝试从.wrath内容框中删除填充内容，因为我有同样的想法，但没有解决它。但是，当我将它移动到它自己的div中时，正如您所示，我已经纠正了它。是的，我个人尝试保持引导网格类自己，这会使代码更清晰。
body {
    padding-top: 20px;
    padding-bottom: 20px;
    background: url('../img/wh-background-1.jpg') center center no-repeat fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
.navbar {
    margin-bottom: 20px;
}
.logo-header {
    color: #FFF;
}
.logo-header h1 {
    margin-bottom: 0;
}
.logo-header h4 {
    margin-top: 0;
    margin-bottom: 20px;
}
footer {
    margin-top: 20px;
}
.inner-container {
    background: rgba(119, 119, 119, .5);
    border-radius: 6px;
    padding: 20px;
}
.wrath-content-box {
    border-color: #e7e7e7;
    background-color: #f8f8f8;
    border-radius: 6px;
    padding: 15px;
}
.news-post {
    margin-bottom: 20px;
}

<div class="col-md-3">
  <div class="wrath-content-box">
    ...
  </div>
</div>