Responsive Logo for Fusion

resolved (8 posts) (2 voices)

  1. felinedesign

    Hello. I'm trying several ways to make the logo smaller on Fusion for mobile devices with no luck. I tried the following code but that only makes my logo disappear or stay the same size.

    @media screen and (min-width: 100px) {
    .mobilelogo { display: none !important; }
    .logo { display: block !important; }
    @media screen and (max-width: 120px) {
    .mobilelogo { display: block !importantt; }
    .logo { display: none !important; }

    Posted 2 years ago #
  2. Elliott

    Hello felinedesign,

    See here,

    Posted 2 years ago #
  3. felinedesign

    Sorry, all that does is put a white box in my header area (from the php code) and my logo disappears. I did this into the mobile custom CSS, but no responsive logo:

    .mysite_responsive .logo {
    max-width: 100% !important;
    height: auto !important;

    Posted 2 years ago #
  4. felinedesign

    Any remedy for this?

    Posted 2 years ago #
  5. Elliott

    You need to do #1.

    Posted 2 years ago #
  6. felinedesign

    This still does not work. All I get is a white box where the logo used to be. Judging from the responses to this thread there does not seem to be a solution.

    Posted 2 years ago #
  7. felinedesign

    Hello? This option did not work.

    Posted 2 years ago #
  8. felinedesign

    Okay. I did my own research and user farnell had it correct for the CSS portion:

    /*Let logo scale down with small screen*/
    .logo, .logo img {
    max-width: 100%;
    height: auto;

    Posted 2 years ago #


You must log in to post.

Construct WordPress Theme
Construct wordpress theme
Myriad WordPress Theme
Myriad wordpress theme
Method WordPress Theme
Method wordpress theme
Fusion WordPress Theme
Fusion wordpress theme
Elegance WordPress Theme
Elegance wordpress theme
Echelon WordPress Theme
Echelon wordpress theme
Dejavu WordPress Theme
Dejavu wordpress theme
Modular WordPress Theme
Modular wordpress theme