html - 将关闭按钮固定在视频的右上角

Question

当您第一次访问我的页面时，我有一个全屏播放的视频。我想在右上角有一个关闭按钮，但我只能把它放在窗口的右上角，而不是实际的视频

JSFIDDLE

  <div id="vid">
   <a href="#" class="close_vid"/></a>
   <video  width="100%" height="100%" autoplay>
   <source src="aa.ogg" type="video/ogg">
   <source src="aa.mp4" type="video/mp4">
   <source src="aa.webm" type="video/webm">
   <object data="aa.mp4"  width="100%" height="100%">
   <embed  width="100%" height="100%" src="movie.swf">
  </object>
 </video>
</div>  

我的 CSS

#vid {
 background-color: black;
 clear: both;
 float: left;
 height: 100%;
 list-style: none outside none;
 position: relative;
 width: 100%;
 z-index: 900;
}

#vid .close_vid {
 background: url(icons/zoom-on.png) no-repeat;
 top: 6px;
 cursor: pointer;
 height: 290px;
 opacity: 1;
 position: absolute;
 width: 29px;
 z-index: 999;
 right: 5px;
}

Answer 1

#vid .close_vid {
    position: relative;
}