CODEWITHSUNDEEP
htmlcss
Dani Tsez
Dani Tsez

Reputation: 21

Make my website logo adapt different resolutions

I'm currently building a website (wesurf.co.il) and I'm having some trouble with the logo part. Im trying to make the logo stay on the left side ( next to the central menu). while on 1920x1080 it looks good, in other resolution's the logo just blend with the menu or dissapearing. thanks for helping.

Upvotes: 1

Views: 77

Answers (3)

EPurpl3
EPurpl3

Reputation: 752

You can use this CSS. Also, you should use a SVG logo so it can scale on any device.

.logo-img {
    width: 100%;
}
#header .nav-main.boxed{
    max-width: 843px;
}
#header .logo {
    padding-top: 10px;
    padding-bottom: 10px;
    float: left;
    width: calc(100% - 873px);
}

Upvotes: 0

Djamel Korei
Djamel Korei

Reputation: 774

Try this code hope it will help : 

<div style="display:flex; align-items: center; background:#888;">
  <div class="logo-img"> logo </div>
  <div class="menu" style="margin:auto;"> menu </div>
</div>

Upvotes: 0

raviramani
raviramani

Reputation: 522

http://prntscr.com/l3zprs you can set it like this change css for <a> </a> and <img/>

Upvotes: 1

Related Questions