I want to make a responsive banner. Please see the image.
I am using bootstrap. When I see it on mobile screen, the text and bottom images should scale accordingly. Can anyone help me implementing that? All the images, text should be responsive and scale accordingly. Regards.
This is my banner normally. On large screen.
When I see it on small screen, the text and images dont scale, instead they overlap.
This is the code to my slider. Also I want the bottom 3 images to be hoizontal, not verticle.
<!-- Slider -->
<div id="main-slider" class="flexslider">
<li> <img src="img/slides/1.png" alt="" />
<p>It's color therapy like you've never seen before!
<br /> Colorpeutic is available on mobile for <span style="color:red">FREE</span>!
<br /> It's no longer a secret - coloring books have transcended age, and have become a worldwide phenomenon. Just relax and paint in a stress-free environment -- let your imagination soar!
<ul style="color:black !important; font-size:12px !important; line-height:16px !important">
<li>Available Free on all major mobile platforms including iPhone, iPad, Google Play and Amazon!</li>
<li>Unlimited colors available for FREE!</li>
<li>Pinch to zoom on all mobile devices!</li>
<li>Categories include mandalas, floral, animals, abstract, landscapes and much more!</li>
<li>Simply pick a color and tap area to fill!</li>
<li>Easy to save your work, share with friends, or share it online!</li>
<a href="#"><img src="img/app_store.png" alt="" class="img-responsive" style="height:40px; width:150px;" /></a>
<a href="#"><img src="img/google_play.png" alt="" class="img-responsive" style="height:40px; width:150px;" /></a>
<a href="#"><img src="img/amazon.png" alt="" class="img-responsive" style="height:40px; width:150px;" /></a>
<!-- end slider -->
I do that thing with the help of
It's the best way to show your text for me in mobile view also.
you can have a look at this for reference
You can see in it that the text doesn't leave the image and image also behave as a
background-size:cover. it's the only reference for you that I wanna show. If it help's you just tell me, I will be happy to know.