Viewing 22 posts - 1 through 22 (of 22 total)
  • Author
    Posts
  • September 7, 2018 at 12:42 am #1006850
    kitchkitch

    Hi Guys,

    Loving the theme, just made the jump from Propulsion. Can’t work this one out, can you help me please.

    (Mobile) I’m wanting the logo left and burger + cart right but no matter what css i write they always displayed central.

    Thanks in advance.

    September 7, 2018 at 6:36 am #1006921
    Rikard

    Hey kitchkitch,

    Thanks for the screenshot and login details, though the login details seem to not be working. Could you check and verify please?

    Best regards,
    Rikard

    September 7, 2018 at 8:05 am #1006948
    kitchkitch

    Hi sorry about that Rikard, please try the following…

    September 7, 2018 at 10:56 am #1007039
    Victoria

    Hi kitchkitch,

    Best regards,
    Victoria

    September 7, 2018 at 11:03 am #1007045
    kitchkitch

    Hi Victoria, no that’s not what I’m seeing unfortunately, if you open the attachment I sent initially I have attached what i’m seeing on mobile devices.

    When I test the page on Screenfly it works perfectly however the reality is different.

    I hope that makes sense.

    Kitch

    September 7, 2018 at 1:28 pm #1007106
    Victoria

    Hi Kitch,

    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: 767px) {
    .responsive #top .logo {
        width: 54%;
    }
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    September 7, 2018 at 1:46 pm #1007109
    kitchkitch

    HIa,

    Ok, so I tried the code in Quick CSS and custom.css and nothing happened, the logo still remains in the centre.

    Shall I send you a screen shot of my mobile iPhone 7plus?

    Kitch

    September 7, 2018 at 3:45 pm #1007148
    kitchkitch

    After hours of trying I’m one step towards working it out:

    @media only screen and (max-width: 767px) {
    .html_header_top #top .av_logo_right .logo {
    right: auto;
    left: 10%;
    margin-left:-60px!important;
    }
    }

    This code aligns the logo left on iPhone 7+, however turn the phone and the margin stays the same between the logo and menu.

    left: 10%;
    margin-left:-60px!important;

    I think the solution might be found here in the bold code, this need to say ‘align the logo to the left page margin’

    Hope this helps.

    Kitch

    September 9, 2018 at 7:58 pm #1007677
    Basilis

    Hi,

    Thank you very muh for sharing it – we appreciate it a lot!

    Best regards,
    Basilis

    September 9, 2018 at 8:04 pm #1007680
    kitchkitch

    Hi, the code I used above still doesn’t do the job, if still looking for a solution, I’ve literally tried all the available code on the forums, 5 days of trying now and i’m no closer to finding a fix. Really need your help on this one.

    Thanks,

    September 9, 2018 at 8:43 pm #1007694
    kitchkitch

    I still have no solution for the Cart page on mobile being too wide.

    thanks,

    Kitch

    September 9, 2018 at 8:51 pm #1007696
    kitchkitch

    I’ll stop trying different css codes now for both issue until I hear back from you.

    If there is anything I can do in the meantime please let me know.

    K

    September 9, 2018 at 10:05 pm #1007707
    kitchkitch

    I have found a solution to the cart border issue, add the following code to quick CSS:

    @media only screen and (max-width:767px) {
    #top table {
    overflow: visible !important;
    }

    .responsive table.shop_table.cart td {
    border-left: 1px solid #e1e1e1;
    }

    div a.remove {
    margin: 0 auto;
    }
    }

    September 9, 2018 at 10:08 pm #1007708
    kitchkitch

    Now just the logo issue to resolve on mobile and tablet.

    September 9, 2018 at 11:06 pm #1007711
    kitchkitch

    Good news! the following code is the closest i can get to a solution:

    @media only screen and (max-width: 2000px) {
.responsive #top .logo {
    width: 40% !important; 
}
.responsive #top .logo img {
    float: left !important; 
}
}

    If possible i would like to show the logo slightly larger (mobile portrait) and when the mobile is turned horizontally the logo steps in from the left margin. any help on this would be much appreciated.

    K

    • This reply was modified 6 years, 2 months ago by kitchkitch.
    September 11, 2018 at 7:06 pm #1008523
    Victoria

    Hi kitchkitch,

    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 .logo {
        width: 60% !important;
    }
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    September 11, 2018 at 7:34 pm #1008546
    kitchkitch

    Hi Victoria,

    Sorry, that code doesn’t work. The logo increases in size yes but the margin on the left also increases pushing the logo towards the centre.

    Kitch

    September 11, 2018 at 8:48 pm #1008603
    Victoria

    Hi Kitch,

    Hm, it’s not supposed to be like that.

    Best regards,
    Victoria

    September 11, 2018 at 9:50 pm #1008618
    kitchkitch

    I know and totally understand what you’re saying/seeing, when I view the website on mobile and tablet using an online desktop viewer (Screenfly) the code works, however when I view it on a variety of mobiles and tablets the code does not work. It’s very strange.

    Is there nothing else we can try?

    Kitch

    September 12, 2018 at 10:14 pm #1009086
    Basilis

    Hi,

    Unfortunately, it would require quite some time and customization of the theme to achieve this, so I am sorry to tell you that this is not covered by our support. However, if it’s really important for you to get this done, you can always hire a freelancer to do the job for you :)

    Best regards,
    Basilis

    September 13, 2018 at 12:41 am #1009125
    kitchkitch

    Hi Guys,

    Thanks for trying to help me, I do appreciate your time.

    I have good news!!! The fix was simple, I changed the header logo from SVG to PNG, job done, all working.

    Thanks,

    Kitch

    September 13, 2018 at 5:11 am #1009200
    Vinay

    Hi,

    Glad we could help!

    Please take a moment to review our theme and show your support https://themeforest.net/downloads
    Don’t forget to bookmark Enfold Documentation for future reference.

    Thank you for using Enfold :)

    Best regards,
    Vinay

  • Author
    Posts
Viewing 22 posts - 1 through 22 (of 22 total)
  • The topic ‘Enfold mobile logo and burger displaying in the centre’ is closed to new replies.