我该如何解决？

这是代码：

ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
 
.level_1 > li {
  float: left;
  width: 45%;
  background-color: #2FA4CF;
  margin-right: 6px;
}
 
.level_1 > li:hover ul {
  display: block;
}
 
.level_2 {
  display: none;
  position: absolute;
  width: 45%;
}
 
.level_2 li {
  background-color: #535B68;
}

<ul class="level_1">
  <li>
    <a href="#">Level one (1)</a>
    <ul class="level_2">
      <li><a href="#">Level two (1)</a></li>
    </ul>
  </li>
  <li><a href="#">Level one (2)</a></li>
</ul>
 
<p>Paragraph</p>

看到这里的结果：http://jsfiddle.net/5uf2Y/
悬停“一级(1)”,您将看到,第二级与第一级不一样大小…