如何在引导程序中覆盖单个 div 的填充？

Question

我正在自定义一个引导主题，我遇到了一个可能很容易解决的问题。

我有一个这样的数据块：

                    <!-- Data block -->
                    <article class="span4 data-block">
                        <div class="data-container">

                            <section>
                                <img src="photo.jpg" width="350" height="350">
                            </section>
                            <section>
                                <p>Some writing below here</p>
                            </section>
                        </div>
                    </article>
                    <!-- /Data block -->

我这部分的 CSS 是：

.data-block .data-container {
  padding: 23px 23px 3px 23px;
  background-color: #ffffff;
  border: 1px solid #bec2c8;
  *zoom: 1;
  -webkit-border-radius: 2px 2px 0 0;
  -moz-border-radius: 2px 2px 0 0;
  border-radius: 2px 2px 0 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-shadow: 0 0 3px rgba(0,0,0,0.15), 0 4px 0 -3px #fff, 0 4px 0 -2px #bec2c8, 0 8px 0 -5px #fff, 0 8px 0 -4px #bec2c8;
  -moz-box-shadow: 0 0 3px rgba(0,0,0,0.15), 0 4px 0 -3px #fff, 0 4px 0 -2px #bec2c8, 0 8px 0 -5px #fff, 0 8px 0 -4px #bec2c8;
  box-shadow: 0 0 3px rgba(0,0,0,0.15), 0 4px 0 -3px #fff, 0 4px 0 -2px #bec2c8, 0 8px 0 -5px #fff, 0 8px 0 -4px #bec2c8;
}

由于：

padding: 23px 23px 3px 23px;

我在图像周围有一个空间。我想为网站上的所有其他数据块 div 保留相同的填充，但在这个数据块上只有没有填充（以便图像在 div 内完全显示而没有填充）。

我试过了：

<div class="data-container nopadding">

然后在 CSS 中添加了一个具有 0px 填充的附加类，但这不适用于覆盖。我确定这就是我做错了什么。

有人可以指导我正确的方向吗？非常感谢:)

Answer 1

您可以尝试将 .data-container.nopadding 作为 CSS 选择器而不仅仅是 .nopadding，如果上述方法不起作用，您还可以在 padding: 0 后指定 !important 以强制执行此操作。