JSFiddle - React, Tailwind, and code Playground

by lottikarotti

HTML

<div id="slider_wrapper">
    <div id="home" class="slider_page slider_page">HOME</div>
    <div id="blog" class="slider_page">BLOG</div>
    <div id="contact" class="slider_page">CONTACT</div>
</div>

CSS

html, body {
    margin: 0 ;
    padding: 0 ;
    width: 100% ;
    height: 100% ;
    font: inherit ;
    border: 0 none ;
}

#slider_wrapper {
    width: 800px ;
    overflow: hidden ;
}

.slider_page_active {
    width: 800px ! important ;
}

.slider_page {
    float: left ;
    width: 0px ;
    height: 200px ;
    background-color: lightyellow ;
    overflow: hidden ;
}