元素之间不需要的边距 - 无法删除

Unwanted Margin Between Element - Unable to Remove

我的 'DIV: IMAGE' 和 'DIV: SLIDER' 之间有一个很大的 'white-space',我无法解释。我看不到我在两个元素之间编写了边距,无论我对样式表做了什么,我都无法删除它。
代码的哪一部分导致了这个?有哪些干净的解决方案?非常感谢。

.wrap {
  margin: 0px auto;
  width: 80%;
  margin-top: 10px;
  padding: 3em 0em;
  position: relative;
  color: #FFF;
}
.image {
  background-image: url("http://www.thestrandnyc.com/d/main/media/Destination/__thumbs_1200_700_crop/NY_City.jpg");
  background-size: 110% 100%;
  padding: 0px 0px 210px 0px;
  border: 1px solid red;
}
.slider {
  padding: 2em 0em;
  background-color: #F4F4F4;
  position: relative;
  height: 200px;
  margin: 0px auto;
  border: 1px solid red;
}
.slider p:first-child {
  color: #fff;
  background: #35AFBA;
  font-size: 2.8em;
  font-weight: 900;
  border-radius: 100%;
  width: 200px;
  height: 200px;
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  line-height: 200px;
  margin: 0em 0em 0em 1.2em;
  position: absolute;
}
.slider p:nth-child(2) {
  color: #ff605f;
  text-shadow: 0px 0px 2px #ff605f;
  background: rgba(230, 231, 231, 0.56);
  font-size: 2.8em;
  font-weight: 900;
  border-radius: 100%;
  width: 200px;
  height: 200px;
  display: inline-block;
  text-align: center;
  line-height: 200px;
  margin: 0em 0em 0em 4.5em;
  position: absolute;
}
<body>

  <div class="image">
    <div class="wrap">
      <div class="nav">

        <h1>Resume</h1>
        <ul>
          <li>Home</li>
          <li>Portfolio</li>
          <li>Skills</li>
          <li>Experience</li>
          <li>Contact</li>
        </ul>

      </div>

      <div class="me">
        <h2>Andrew Hardiman</h2>
        <p>Webdesigner & Developer</p>
        <p>Read More</p>
      </div>

    </div>
  </div>

  <div class="wrap">
    <div class="slider">

      <p>HTML</P>
      <p>css</P>
      <h3>I design and develop amazing websites that are sleek, easy-to-navigate and exiting to use.</h3>
      <p>Work with us to plan your digital marketing mix and achieve better results online.</p>
    </div>
  </div>

div.sliderdiv.wrap 里面,里面有一个 margin-top 和一个 padding。它们造成了间隙,移除它们将解决这个问题。

你的 .wrap 元素有 padding 的 3em 和 margin-top 的 10px,尝试删除那 2 css 规则,应该不会再有 white-space.

http://jsfiddle.net/haxj27mm/1/

.wrap {
   margin: 0px auto;
   width: 80%;
   margin-top: 0px;
   padding: 0em 0em; 
   position: relative; 
   color: #FFF;
}