I make a slider, give four pictures positin: absolute, and from above I try to enter some text, but it is not displayed, because it is under the pictures. What to do so that the pictures were under each other and objects could be placed in them? (Text / images / blocks)

My code All four pictures are position: absolute; and the text is not displayed, it is under the pictures, why? how to do?

css

  • w3schools.com/bootstrap/bootstrap_carousel.asp - soledar10
  • You yourself answered your question. If possible, try wrapping each image with a div -om, include text in the same block, assign the desired #slider and rotate the blocks, not the images. Hope this helps you. - malginovdesign
  • Please paste the code into the body of the question with text, not an image. - Nicolas Chabanovsky ♦

1 answer 1

Hello! You are not using bootstrap correctly. Bootstrap already has a ready slider .

If you do not want to use it in your project - pay attention to how it is implemented.

If you refuse what bootstrap offers: You need to wrap the images in additional blocks. You try absolute positioning on the parent block and on the block with the text you want to display on top of the image.

In addition: you have the same size for all screens. You only need to specify col-sm-12. (in this case, bootstrap will apply the size you specify to all larger screens)

those.

 class="col-sm-12 col-md-12 col-lg-12"

equivalent to

 class="col-sm-12"