JSFiddle - React, Tailwind, and code Playground

HTML

<ul class = "links">
            <li>
                <!--<a href="http://www.google.ie" target ="content">Test</a>-->
                <form method="link" action="http://www.google.ie" target = "content">
                    <input type="submit" value="google">
                </form>

                |
            </li>
            <li>
                <!--<a href="dashboard.html.erb" target ="content">Dash</a> |-->
                <form method="link" action="http://www.google.ie" target = "content">
                    <input type="submit" value="google">
                </form>

                |
            </li>
            <li>
                <!--<a href="pageview.html.erb" target ="content">Page</a> |-->
                <form method="link" action="http://www.google.ie" target = "content">
                    <input type="submit" value="google">
                </form>

                |
            </li>
            <li>
                <!--<a href="listview.html.erb" target ="content">List</a>-->
                <form method="link" action="http://www.google.ie" target = "content">
                    <input type="submit" value="google">
                </form>

                |
            </li>
        </ul>

CSS

ul li.prev {
            float:left
        }
        .links {
            margin: 0;
            padding: 0;
            background: #666;
            text-align: right;
        }
        .links li {
            display: inline-block;
            *display: inline;
            zoom: 1;
            padding: 0 5px;
        }
        .links li form {display: inline}