Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • January 26, 2021 at 4:19 pm #1275516
    sdesign-web

    Hi,
    can you please give me the quick CSS code to fix the problem with the burger menu going over the logo on small screen ( phone, small tablet )
    > see below screenshot
    burger-menu-over-logo-display
    Thank you in advance for your help,
    best regards,
    Stan

    January 27, 2021 at 12:27 am #1275624
    Victoria

    Hey sdesign-web,

    Could you please give us a link to your website, we need more context to be able to help you.

    Best regards,
    Victoria

    January 27, 2021 at 10:17 am #1275686
    sdesign-web

    Hey Victoria,

    please find in private content the url of the website.

    Thanks !

    Stan

    January 27, 2021 at 10:40 am #1275706
    Victoria

    Hi Stan,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
@media only screen and (max-width: 479px) {
    .responsive #top #wrap_all .container {
        width: 100;
        max-width: 100%;
    }
    .responsive .logo img {
        width: 90%;
    }
 
}
@media only screen and (min-width: 480px) and (max-width: 767px) {
        .responsive #top .logo img {
            width: 75%;
        }
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    January 28, 2021 at 7:39 pm #1276107
    sdesign-web

    Hello Victoria,
    thank you very much for your help !

    Your css trick solve the problem on small all vertical display such as iphone 5 etc …
    On the other hand, the problem subsists on iPad screens in landscape mode. Maybe by changing some values ​​in the css? What do you think ?

    Kind Regards
    Stan

    January 28, 2021 at 7:40 pm #1276108
    sdesign-web

    … ex :screenshot on ipad landscape mode
    Capture-d-e-cran-2021-01-28-a-18-31-27

    January 28, 2021 at 9:51 pm #1276164
    Victoria

    Hi sdesign-web,

    Please add this code too:

    
@media only screen and (min-width: 768px) and (max-width: 1023px) {
    .html_header_top.html_logo_center .logo {
        left: 0px;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
    }
}

    Best regards,
    Victoria

    January 29, 2021 at 5:20 pm #1276353
    sdesign-web

    Super Victoria! !,
    everything is working fine with your quickcss.
    Thank you for ypour help.
    have a nice we
    Stan

    January 29, 2021 at 9:13 pm #1276425
    Victoria

    Hi Stan,

    Glad we could help :)

    If you need further assistance please let us know.
    Best regards,
    Victoria

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