Logo problem in responsive mode

Viewing 3 replies - 1 through 3 (of 3 total)
  • Thread Starter Halil ESEN

    (@halilesen)

    2 years, 8 months ago

    When I do this, the menu line still remains below:

    .title-container .custom-logo {
	max-width: 140px;
	max-height: 65px;
	
}

@media all and (max-width: 799px) {
	.title-container .custom-logo {
		max-width: 110px;
	}
}
@media all and (max-width: 600px) {
	.title-container .custom-logo {
		max-width: 90px;
		margin-top: -4px;
	}
}

    Can we also scale the top and bottom padding of the logo on the desktop?

    Theme Author Ben Sibley

    (@bensibley)

    2 years, 8 months ago

    You’re on the right track. I think the logo just needs to be even smaller to fit in the space available.

    Since it’s the height we need to limit, setting the max-height will be more straightforward:

    @media all and (max-width: 799px) {

  .title-container .custom-logo {
    max-height: 36px;
  }
}
    Thread Starter Halil ESEN

    (@halilesen)

    2 years, 8 months ago

    I understand. Seems like it’s better to go over width. Because while the ratio in height deteriorated, it preserved itself in width.

    Thanks.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Logo problem in responsive mode’ is closed to new replies.