JSFiddle - React, Tailwind, and code Playground

by BramVanroy

HTML

<div id="Wrapper">
    <div id="H_wrap">
        <header id="M_head">Abracci</header>
        <nav id="N_bar">
            <ul>
                <li><a class="NB" href="#">Men</a>

                </li>
                <li><a class="NB" href="#">Women</a>

                </li>
                <li><a class="NB" href="#">Children</a>

                </li>
                <li><a class="NB" href="#">Apparel</a>

                </li>
            </ul>
        </nav>
    </div>
    <section id="M_section"></section>
    <aside id="M_aside"></aside>
    <footer id="M_footer"></footer>
</div>

CSS

* {
    margin:0px;
    padding:0px;
    list-style-type:none;
}
body {
    background-image:url("Aba2.jpg");
    text-align:center;
}
header, section, footer, aside, nav {
    display:block
}
#Wrapper {
    border: 2px solid blue;
    width:1000px;
    margin:20px auto;
}
#H_wrap {
    padding:10px;
    border:2px solid yellow;
    background-image:url("Abracci1.jpg");
    background-repeat:repeat-x;
}
#M_head {
    padding:10px;
    font:italic bold 34px/30px"Times New Roman" Times, arial;
    Text-align:center;
    color:#000000;
    text-shadow:2px 2px #999999;
    text-decoration:underline;
}
#N_bar {
    padding:20px;
    text-align:center;
    word-spacing:6em;
    font:italic bold 25px/30px"Times New Roman" Times, arial;
    text-shadow:3px 3px #999999;
}
a.NB:link {
    color:red;
}
a.NB:visited {
    color:blue;
}
a.NB:hover {
    color: green;
}
a.NB:active {
    color:#423243;
}
#N_bar li {
    display:inline-block;
}
#M_section {
    background-image:url("Aba3.jpg");
    float:left;
    clear:both;
}