Logo Collapsing

Hi, When I resize my browser my logo
on the top corner does not seem to resizing.
and it collapses at mobile size.
Website

there’s simply not enough room. Your a.navbar-brand is 298px wide and menu button 66px
the .navbar-header which wraps above is 383px

youll need to put your current css in a media query starting around 430px. Prior to this the .navbar-header and contents will need to work on percentages

Something like this.

@media screen and (max-width:440px){
.navbar-brand{
height:auto;
width:75%;
}
.navbar-brand img{max-width:100%}
.navbar-toggle {margin:10px -10px 8px 0}
}

Is it best to say:

@media screen and (max-width:440px) {}

or?

@media (max-width:440px)

Probably with the “screen” in there. If you leave it off, all other medias will get it. And for stuff like print, you should probably keep separate styles declared there.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.