Multiple items to the right in a meun


#1

I want to place the Login, Sign Up and search bar items to the right of the menu, but they all kind of get “squashed” together. How can I place multiple items to the right then?

 <div class="ui menu">
    <a class="item" href="#">Home</a>
    <a class="item" href="#">About</a>
    <a class="item" href="#">Contact us</a>
    <div class="right item" href="#">
        <div class="ui icon input">
            <input type="text" placeholder="Search...">
            <i class="search icon"></i>
        </div>
        <div class="ui primary button">Sign Up</div>
        <div class="ui button">Log In</div>
    </div>

#2

Try this:

[code]

Home About Contact us
</div><div class="right item" href="#">
   <div class="ui">
   
    <div class="ui icon input">
        <input type="text" placeholder="Search...">
        <i class="search icon"></i>
    </div>
    
    <div class="ui primary button">Sign Up</div>
    <div class="ui button">Log In</div>
    </div>
</div>
</div>

[/code]