How to set Logo height in Nav bar? (Resolved)

[Nic727 0]

Hi,

 

I have a little problem. I finished my logo and want to add it to my website right before my name in the nav bar, but if I had the image, it break my navigation.

 

I'm not really sure how I can fixe that. I tried some stuffs here and there, but wasn't really successful. I would like to set a height to my image, but I don't want my image to mess up with the general height of the navigation.

<!-- NAVIGATION BAR -->
        <header class="navigation">
            <div class="nav-container">
                <a class="logo" href="nicolas-duclos.com"><img src="images/Logo-black.png"> NICOLAS DUCLOS</a>
                <!-- MOBILE MENU -->
                <a class="mobile-menu" href="#"><i class="fas fa-bars" aria-hidden="true"></i></a>
                <nav class="right-menu">
                    <a class="close-mobile-menu" href="#"><i class="fas fa-times"></i></a>
                    <ul class="menu">
                        <li class="menu-item"><a href="index.html">ACCUEIL</a></li>
                        <li class="menu-item"><a href="albums.html">ALBUMS</a></li>
                        <li class="menu-item"><a href="blogue.html">BLOGUE</a></li>
                        <li class="menu-item current"><a href="a-propos.html">À PROPOS</a></li>
                        <li class="menu-item"><a href="#">CONTACT</a></li>
                    </ul>
                </nav>
            </div>
        </header> 

My idea would be to use display flex to my nav-container and items-align:center, but it make my floating right "right-menu" going to the left next to my logo and name. My goal is to have logo+name on left and menu on the right. Do you have any idea how I can do that?

 

Thank you

Edited June 17, 2018 by Nic727

[Nic727 0]

Nevermind, saw that justify-content:space-between to nav-container and adding vertical-align:middle to my image fixe that. Not sure why vertical-align work here since my image is not in a table, but nice to see it works.