JSFiddle - React, Tailwind, and code Playground

by kakss

HTML

<div class="custom-nav fixed-top">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <nav class="navbar navbar-expand-lg navbar-dark">
                        <a class="navbar-brand data-scroll" href="#top">ABC.<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAABHNCSVQICAgIfAhkiAAAAAFzUkdCAK7OHOkAAAAEZ0FNQQAAsY8L/GEFAAAACXBIWXMAAA7EAAAOxAGVKw4bAAABkElEQVQ4T62VParCUBBGkwcGOystFcElpBI3oI0gVhaKWNimSSMuwMI2lWARS0kRcAcuQ0RQd6Ag/s5zPid5mhc1ggfCzXzjHHMvEVW6onyRH1kfUFVVmUwmUn0IP+E9HHW7Xazn81nS6DwIWdLv93E/Go1Qf4o/cS/zKBQKVCqVpIoGhN42w+Ce67pSvQdCx3EwaNs2wnuOxyN6u91Oktf4W97v9xjkbQbhnK9KpSLJc/zXRtM0livxeByvzel0Qs73w+EQvUQigbrdbqMXCrQBxuOx/1RXmaR/FItF9MLOPVTIbLdbDD2DjyiVSlG1WpXkxvOJK+VymZrNplT/CfvSl0ImONDr9SibzUp16y8WC6kiCFutFs7MI5fLQTKdTlE3Gg0yDAP3zFshwwI+Mw+WcbZcLmk+nz/sIpKw0+lQMpmkzWYjCdFqtYLocDhgvVwuyCMJmVqthkG+6vU6zWYz/1eUyWTIsix8LrLQY71ek2maFIvFIEun01h1XUf/Y2GQwWBA+XweUubLfwGK8gtFdWiI8JTYcQAAAABJRU5ErkJggg=="/>YZ</a>
                    </nav>
                </div>
            </div>
        </div>
    </div>

CSS

.navbar-brand {
    padding: 0;
    font-size: 25px;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 1px;		
}

.navbar-brand {
    display: inline-block;
    margin-right: 1rem;
    line-height: inherit;
    white-space: nowrap;
}

a {
	text-decoration: none;
}