CODEWITHSUNDEEP
htmlbootstrap-4navbar
user10247319
user10247319

Reputation:

Bootstrap Navbar Image size is too big

I am new to bootstrap 4 and I have a question about the navbar. So I want to have my Company name and its logo next to it, but for some reason the image is way too big. What can I do to change the size of the image to fit inside of the navbar. Thank you!

<nav class="navbar navbar-expand-sm fixed-top">
    <div class="container">
      <a href="index.html" class="navbar-brand text-dark display-4">
        <img id="ojLogo" src="img/ojicon.png"> OddJob
      </a>
    </div>
</nav>

Upvotes: 2

Views: 12070

Answers (1)

Nav Raj Bhattarai
Nav Raj Bhattarai

Reputation: 410

You have to define height of logo image to reduce its image size. Also need to float image to left in order to have company name next to this. Also define width of navbar-brand if necessary. You can use following css: 

.navbar-brand {
  width:150px;
  font-size: 24px;
}
.navbar-brand img {
  height: 50px;
  /* put value of image height as your need */
  float: left;
  margin-right: 7px;
}

Upvotes: 7

Related Questions