我在视频背景上显示内容时遇到问题。我为背景视频和应该出现在其顶部的 div 设置了正确的 z-index，但它不起作用。我应该怎么做才能在视频顶部显示内容？
HTML：
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" href="normalize.css">
<link rel="stylesheet" href="css/video.css">
<link rel="stylesheet" href="css/style.css">
<meta charset="utf-8" />
<meta name=”description” content=”” />
</head>
<body>
<div class="wrapper">
<div class="button">HELLO</div>
</div>
<video id="video_background" preload="auto" autoplay="true" loop="loop" muted="muted" volume="0">
<source src="img/splash.webm" type="video/webm">
<source src="img/splash.mp4" type="video/mp4">
<source src="img/splash.ogv" type="video/ogg ogv"; codecs="theora, vorbis"/> Video not supported </video>
</body>
</html>
CSS：
.wrapper {
width: 960px;
height: 100%;
z-index: 20;
}
.button {
z-index: 20;
width: 300px;
height: 300px;
}
#video_background {
position: absolute;
bottom: 0px;
right: 0px;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
z-index: -1000;
overflow: hidden
}