Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • May 4, 2016 at 4:15 am #626853
    smapua

    how to insert phone icon (png) between logo and menu toggle in mobile view

    here is my screen sample > Insert icon between logo and menu toggle

    thanks

    • This topic was modified 8 years, 7 months ago by smapua.
    May 5, 2016 at 5:21 am #627596
    Rikard

    Hey smapua,

    You could try adding a widget area to the header: http://kriesi.at/documentation/enfold/adding-a-widget-area-to-the-header/. We can help you out with styling and hiding it on larger screens once you’ve added it.

    Regards,
    Rikard

    May 5, 2016 at 5:32 am #627600
    smapua

    Please give some instructions on how to insert png phone icon between logo and mobile menu toggle… step by step, i dont know the css code… thanks

    May 5, 2016 at 7:55 am #627664
    smapua

    the logo and menu toggle blocked the phone icon on mobile view….

    logo and menu icon blocked the phone icon
    #header .widget {
    left: 84%;
    padding-top: 8px;
    position: absolute;
    top: 0;
    transform: translate(-50%);
    z-index: 999;
    }

    /***********/
    @media only screen
    and (min-device-width : 320px)
    and (max-device-width : 480px) {
    .phoneicon { display:block; }
    }

    @media only screen
    and (min-device-width : 768px)
    and (max-device-width : 1024px)
    and (orientation : portrait) {
    .phoneicon { display:none; }
    }

    @media only screen
    and (min-device-width : 768px)
    and (max-device-width : 1024px)
    and (orientation : landscape) {
    .phoneicon { display:none; }
    }

    @media only screen
    and (min-width : 768px) {
    .phoneicon { display:none; }
    }

    May 6, 2016 at 8:04 am #628157
    Rikard

    Hi,

    At very small sizes it seems your image can’t fit so I think you have to look for some alternative solutions, maybe add another widget to the header with a link reading click here to call maybe?

    Thanks,
    Rikard

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.