JSFiddle - React, Tailwind, and code Playground

by core972

HTML

<div id="navbar">
            <ul>
                <li>
                    <a href="https://rb.gy/5o6pmo" title="Discord">
                        <img src="https://rb.gy/trhqyb" alt="FMW Logo">
                    </a>
                </li>
                <li>
                    <a href="index.html" title="home">Home</a>
                </li>
                <li>
                    <a href="about.html" title="About">About</a>
                </li>
                <li>
                    <a href="support.html" title="Support">Support</a>
                </li>
                <li>
                    <a href="events.html" title="Events">Events</a>
                </li>
                <li>
                    <a href="peaks.html" title="Sneak Peaks">Sneak Peaks</a>
                </li>
                <li>
                    <a href="videos.html" title="Videos">Videos</a>
                </li>
                <li>
                    <a href="updates.html" title="Change Log">Change Log</a>
                </li>
            </ul>
        </div>

CSS

#navbar ul li a {
    display: block;
    text-align: center;
    text-decoration: none;
    color: #A9A9A9;
    padding: 0.5vw 0.6vw;
    font-size: 1.35vw;
    font-weight: bolder;
    font-family: Arial, sans-serif;
}
#navbar ul li:first-child a {
  padding: 0;
}
#navbar ul li a img {
    width: 7vw;
    height: 2.35vw;
    padding: 0;
}