Logo header resize problem

Software Support
2

Hi @Caner_Erden,

The Bootstrap theme is only intended as a base for development. It only implements the basic Bootstrap 3 components, with the intention that a developer will then do some of the final work to turn it into a proper theme. The logo in Bootstrap’s nav area is very small because the framework is designed for mobile-friendly apps, so you’ll need some additional styles if you’d like to use a large logo on the page.

Here’s some quick CSS code that demonstrates one way you could make a larger logo for larger screens:

@media(min-width: 768px) {

  .navbar-brand {
    display: block;
    float: none;
    clear: both;
    margin: 0;
    width: auto;
    height: auto;
  }

  .navbar-brand img {
    width: 100px;
  }

  .navbar-collapse {
    clear: left;
  }
}

To use this, you could copy it into a .css file and then upload it to the Journal Stylesheet area in the Settings > Website > Appearance area.

1 Like