After following some tutorials, I managed to create a carousel with bootstrap that appears perfectly on my laptop's screen. However, when I switch to my smartphone, the carousel disappears and only the indicator arrows along with the image alt text are visible.
The code looks pretty standard:
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="http://s1.picswalls.com/wallpapers/2016/03/29/beautiful-nature-wallpaper_042325903_304.jpg" alt="portfolio1">
<div class="carousel-caption">
<h1>Portfolio1</h1>
</div>
</div>
<div class="item">
<img src="http://s1.picswalls.com/wallpapers/2016/03/29/beautiful-nature-wallpaper_042325903_304.jpg" alt="portfolio1">
<div class="carousel-caption">
<h1>Portfolio2</h1>
</div>
</div>
<div class="item">
<img src="http://s1.picswalls.com/wallpapers/2016/03/29/beautiful-nature-wallpaper_042325903_304.jpg" alt="portfolio1">
<div class="carousel-caption">
<h1>Portfolio3</h1>
</div>
</div>
</div>
I am wondering if there is another CSS class that needs to be added or if adjustments need to be made in the CSS code. Any help would be greatly appreciated!
Thank you in advance.