How can i put a responsive Text over an responsive Image?

Hello Guys i hope someone has a tip for me. How can i put a Text over an Image and make both responsive. I found some ideas on my research but all didn’t help me out. Is there a way to do this with html, css and bootstrap?

You can use position absolute for the text and add img-responsive class in the image.

Not sure if that’s what you meant but take a look:,css,output

Yeah i tried this too, but i searched for a Method, that makes my text smaller, if the device has a smaller screen.

What you can do is use the css @media then you have to specify what’s the font-size you want.

.text {
  position: absolute;
  color: whitesmoke;
  font-size: 32px;

@media (min-width: 768px) {
  .text {
    font-size: 64px;

Take a look here:

ok i will try that thank you