html – Move a div to the right side of the navbar

0
112
html - Animation after toggling doesn't apply the second style


**I want move div of className Navbar_icon to the right side of the navbar. Navbar_icon
contains search, help, sign in. I want move div of className Navbar_icon to the right side of the navbar. Navbar_icon
contains search, help, sign in.
**
Image of current navbar : <enter image description here>

REACT COMPONENT JSX CODE :

            <div className="Navbar">
                <h1 className="logo">eat24/7</h1>
                <div className="Navbar_icons">

                    <div className="Search">
                        <SearchRoundedIcon />
                        <p>Search</p>
                    </div>


                    <div className="Help">
                        <HelpOutlineTwoToneIcon />
                        <p>Help</p>
                    </div>


                    <div className="Sign_In">
                        <PersonOutlineIcon />
                        <p>Sign In</p>
                    </div>
                </div>
            </div>



CSS CODE :
.Navbar{
    height: 80px;
    padding-left: 80px;
    padding-right: 80px;
    padding-top: 35px;
    display: flex;
}
.logo{
    font-family: 'Andada Pro', serif;
    color: orangered;
    font-weight: bolder;
    float: left;
}

.Navbar_icons{
    display: flex;
    position: relative;
    float: right;
}

.Search, .Help, .Sign_In{
    display: flex;
    margin-right: 10px;
    text-align:center;
    
}





Source link

Leave a reply

Please enter your comment!
Please enter your name here