Having trouble aligning the text tag inside the H1 above the image. It keeps appearing in the wrong place, either on the left or right. I've tried including the h1 inside the container, but it just disappears.
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="refresh" content="20; url=011.html" />
<title>title</title>
</head>
<body>
<div class="shadow"<a target="none" href="paris.jpg">
<div id="texto"><h1>Yes</h1></div>
<img src="010.jpg" class="logo">
</div>
<video id="bgvideo" autoplay loop>
<source src="club01.mp4" type="video/mp4">
<source src="movie.ogg" type="video/webm">
Your browser does not support the video tag.
</video>
</body>
</html>
CSS
#texto {
top:198px;
left:365px;
width:62px;
height:51px;
color:white;
position:absolute;
text-align:center;
background-color:black;
}
#texto h1 {
margin:auto;
line-height:51px;
vertical-align:middle;
color: #FFFFFF;
font-size: 75px;
}
div.shadow {
position:absolute;
max-width:90%;
max-height:90%;
top:50%;
left:50%;
overflow:visible;
}
img.logo {
position:relative;
max-width:90%;
max-height:90%;
margin-top:-60%;
margin-left:-50%;
border-radius: 5%;
}
video#bgvideo{
min-width:100%;
min-height:100%;
width:auto;
height:auto;
background-size:cover;
}