html - CSS：试图一个接一个地进入 div

Question

第一个 div 是导航栏，我在twitter-bootstrap. 它有90px height.
其余高度将由另一个具有图像背景的 div 获取。这是第一个导航栏 div 的代码：

<div id="firstDiv" class="navbar navbar-inverse navbar-fixed-top">
    <div class="navbar-inner">
        <a class="brand" href="./index.php">Home</a>
    </div>
  </div>
 <div id="secondDiv" class="invite-bg">
<div class="row-fluid">
  <div class="span6">
      Fluid 6
      <div class="row-fluid">
        <div class="span6">Fluid 6</div>
        <div class="span6">Fluid 6</div>
      </div>
  </div>
</div>

第一个div CSS：

.navbar {
  *position: relative;
  *z-index: 2;
  margin-bottom: 20px;
  overflow: visible;
}

.navbar-inner {
  min-height: 5.7em; /*change*/
  padding-right: 20px;
  padding-left: 20px;
  background-color: #fafafa;
}

第二个div CSS：

div.invite-bg {
    background-image:url('../img/b1g.jpg');
    margin:0 auto;
    width: 100%;
    height: 70%;
    position: absolute;
}

我面临以下问题：

1. 如何在不使用导航栏的情况下放置第二个 div <br/>？
2. 第二个 Div 与第一个 Div 重叠。我想将它们与高度 30% 和 70% 分开。
3. 应该选择什么大小的背景才能完美地适合第二个 div？

Answer 1

div.invite-bg {
    background-image:url('../img/b1g.jpg');
    margin:0 auto;
    width: 100%;
    height: 70%;
    position: absolute;
    top: 30%;/*moves the div down 30% from the top of the screen*/
}

添加的top: 30%;属性应该适用于我认为您要问的内容。