Quantcast
Channel: Active questions tagged html - Stack Overflow
Viewing all articles
Browse latest Browse all 67411

Center absolute container inside another container with CSS

$
0
0

Actually i have this (this screenshot is from other html where i don't need to center the image)

Actually i have this (i need to center the image)

And i need something like this

And i need something like this (this screenshot is from another html where i don't need to center the image)

but i cant position the play button and h3 text "inside" the image... i hope you can help me

.imgContainer {
  width: 100%;
  height: auto;
}

.imgContainer .botonPlay {
  position: absolute;
  display: block;
}

.imgContainer .botonPlay img {
  margin-left: 10px;
  width: 70px;
  height: 65px;
}

.imgContainer h3 {
  position: relative;
  font-family: Roboto;
  font-style: normal;
  font-weight: normal;
  font-size: 50px;
  color: #FFFFFF;
  text-shadow: 3px 1px 0px #000000;
  top: 0px;
  padding-left: 10px;
}

.imgContainer #imagenPeli {
  display: block;
  margin: auto;
}
<div class="imgContainer"><div class="botonPlay"><a href="ver.html"><h3>JOKER</h3><img src="https://puu.sh/EwYad/148efdef71.png" alt=""></a></div><img id="imagenPeli" src="https://puu.sh/EwFra/20b0f2b018.png" class="img-fluid" alt="..."></div>

Viewing all articles
Browse latest Browse all 67411

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>