JSFiddle - React, Tailwind, and code Playground

by Ivan Ivancic

HTML

<!--slide-part-starts--><div class="slide-part">
    <!--slider-starts--><div class="fadein">
<img style="cursor:pointer" onclick="window.location.href='http://myevio.com/powerock-13600mAh-powerbank.html'" src="http://placehold.it/1150x350"><!--powerock-->
<img style="cursor:pointer" onclick="window.location.href='http://myevio.com/powerpunch-10500mAh-powerbank.html'" src="http://placehold.it/1150x350"><!--powerpunch-->
</div><!--slide-ends-->
</div><!--slide-part-ends-->

<!--about-evio-starts--><div class="about-evio">
At EViO, we make tech gear that helps improve productivity,<br />
so that you have more time to do the essential things - living life to the fullest.
</div><!--about-evio-ends-->

CSS

.slide-part{
    width:100%;
    max-width:1600px;
    margin:0 auto;
    min-height:100px;
    height:100%
}

.fadein {
    padding-top: 27%;
    position:relative; 
    width:100%; 
    max-width:1600px; 
    margin:0 auto; 
    min-height:100px;
    height:100%
}

.fadein img {
    position:absolute; 
    left:0; 
    top:0; 
    bottom:0;
    right:0;
    height:100%;
    width:100%; 
    width: auto\9;
}

.about-evio{
    width:100%;
    text-align:center;
    padding:50px 0 50px 0;
    border-top:1px solid #000;
    border-bottom:1px solid #000;
    text-align:center;
    min-height:20px;
    background:#fff;
    font-size:1.2em;
    line-height:30px
}