JSFiddle - React, Tailwind, and code Playground

by Hive7

HTML

<div class="container">
    <ul class="menu">
        <li class="parent"><a href="#">О Фонде</a> 
        </li>
        <li class="parent"><a href="#">Дети</a> 
        </li>
        <li class="parent"><a href="#">Проекты</a> 
        </li>
        <li class="parent"><a href="#">Новости</a> 
        </li>
        <li class="parent"><a href="#">Как помочь</a> 
        </li>
        <li class="parent"><a href="#">Вам нужна помощь?</a> 
        </li>
        <li class="parent"><a href="#">Специалистам</a> 
        </li>
        <li class="parent"><a href="#">Волонтерство</a> 
        </li>
    </ul>
</div>

CSS

* {
    margin: 0;
    padding: 0;
}
body {
    width: 960px;
    margin: 0 auto;
}
.container {
    width: 100%;
}
.menu {
    width: 100%;
    list-style: none;
    position: relative;
}
.parent {
    float: left;
    background: red;
    margin-right: 1px;
    padding: 2%;
}
.parent:last-child {
    margin-right: 0px;
}