html - CSS body 阴影

Question

我通过一起剪切和更改几个主题来构建布局。在该布局上，所有内容后面都有一个由以下 CSS 触发的阴影:

body {
-webkit-box-shadow:0px 5px 10px #1c1c1c;
-moz-box-shadow:0px 5px 10px #1c1c1c;
box-shadow:0px 5px 10px #1c1c1c;
}

所以现在我正在自己重建主题，这样我就可以按照我想要的方式构建 div 和 css。最初的设计有一个标题，其文本右对齐。为了重建，我为标题做了一个 3 列布局，这样我就可以在左侧添加一张照片，在中间添加一些内容。

我无法在我的新布局中使用上面的影子代码。它不会给我的内容留下阴影。相反，如果我采用下面的代码并将其放入 3 列中每一列的每个 Div ID 的 CSS 中，它将产生阴影...但是阴影会溢出到第二列和第三列

-webkit-box-shadow:0px 5px 10px #1c1c1c;
-moz-box-shadow:0px 5px 10px #1c1c1c;
box-shadow:0px 5px 10px #1c1c1c;

现在我不太擅长 HTML 和 CSS，但我正在尽力。我尝试将 3 列放入一个 DIV 中并将阴影放到该 div 上，但它仍然不起作用。我尝试将列插入下面代码中 * 符号的位置

 <div id="blah">**************</div>

有人对我缺少的东西有什么建议吗？

Answer 1

将阴影应用于外部 div 是正确的想法，但如果您使用 div 来制作内部列，则需要对最后一个元素应用clearfix。

<div id="blah">
   <div class="third">First</div>
   <div class="third">Second</div>
   <div class="third">Third</div>
   <div class="clear"></div>
</div>

使用CSS

.clear { clear:both; }

这就是您想要的效果吗？ http://jsfiddle.net/LcBUX/3/