Question

我正在创建一个标签布局，需要＃tab1容器与#tabHeader容器重叠。这是我到目前为止的代码：

<div id="tabsContainer">
  <div id="tab1" style="height: 25px;font-family:'Trebuchet MS', Arial, Helvetica, sans-serif; font-size:14px; float:left; padding-left: 4px; position: relative;">
    <div style="float:left; background:url(css/tabs/images/tab_Selected_Left.png) no-repeat;  height:25px; width: 6px; "></div>
    <div style="float:left; background:url(css/tabs/images/tab_Selected_Content.png) repeat-x; height:25px; text-align: center; padding-left: 5px; padding-right: 5px; padding-top: 4px; ">Home</div>
    <div style="float:left; background:url(css/tabs/images/tab_Selected_Right.png) no-repeat;  height:25px; width: 8px; "></div>
  </div>
  <div id="tabHeader" style="width: 100%; border-top: #8db2e3 solid 1px; clear:both; height:2px;margin-top: -12px;"></div>
</div>

所以我需要让tab1坐在tabHeader部分的1px上。我创建的任何其他选项卡都会这样做。我尝试了一些东西，但我对CSS的定位感到厌恶。任何帮助将不胜感激！

Answer 1

这是您要找的东西：http://jsfiddle.net/GfNve/

另外，使用样式表：）

Answer 2

试试这个：

<div style="height: 25px; font-family: 'Trebuchet MS',Arial,Helvetica,sans-serif; font-size: 14px; float: left; padding-left: 4px; position: relative; border-bottom: 1px solid white; margin-bottom: -1px;" id="tab1">

请注意添加：

border-bottom:1px solid white; margin-bottom:-1px;

希望有所帮助。

CSS有助于覆盖底部的顶部部分

2 个答案: