Html 标题div中的搜索div？

下面是我的基于cssdiv布局的代码。我想在#header div中添加一个搜索框。但是当我在#header.search类中添加边距或填充时，它会将此添加到#header div的高度。请帮助我如何正确获取它。我希望搜索框位于10px边距底部，从那里开始#header div结束

#container {
margin:0px auto;
width:984px;
border-left:#FFFFFF solid 1px;
border-right:#FFFFFF solid 1px;
}

#header {
height:150px;
background: url(./images/header.png) no-repeat;
border-bottom:#FFFFFF solid 1px;
}

#header .search {
margin:0px auto;
text-align:center;
width:620px;
}

---

在两个标记上插入显示，并在底部添加边距。应该可以工作

您可以将搜索框绝对放置在#标题内

这样，您的搜索框将永远不会影响父容器

---

演示：

看起来很奇怪，在

上添加CSS代码填充或边距。搜索
会影响
#标题
。你能在JSFIDLE上发布一个例子吗？你的HTML是什么？请给出一个关于jsfiddle的示例。由于元素不在文档流中，所以绝对位置的netalignment很难实现。不过，一个常见的修复方法是将“left”属性设置为“50%”，并添加元素宽度一半的负“marginleft”。e、 左：50%；左边距：-100px；
#container {
margin:0px auto;
width:984px;
border-left:#FFFFFF solid 1px;
border-right:#FFFFFF solid 1px;
}

#header {
height:150px;
background: url(./images/header.png) no-repeat;
border-bottom:#FFFFFF solid 1px;
position:relative; // parent container
}

#header .search {
margin:0px auto;
text-align:center;
width:620px;
position:absolute;
left:0; bottom:10px;
}