Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #389085

    Hi, as you can see here – http://screencast.com/t/aFbNq1YL – the mobile menu and woocommerce cart button don’t look good. How can I make them appear one beside the other on the right side of the logo?

    Thanks.

    #389818

    Hi DROR!

    to control the menu button on mobile use this:

    @media only screen and (max-width: 989px) {
    .html_mobile_menu_tablet .container #advanced_menu_toggle, .html_mobile_menu_tablet #advanced_menu_hide {
    left: 240px;
    }}
    

    For cart button use this to control it:

    @media only screen and (max-width: 767px) {
    .responsive #top .cart_dropdown {
    right: 4.5%;
    }}
    

    Regards,
    Andy

    #389907

    Added the code and it looks great on iPhone 5 portrait – http://screencast.com/t/iA8GpMzxa3S

    But on bigger screens it doesn’t look as good:
    http://screencast.com/t/YV9xIw3MhNXq
    http://screencast.com/t/sbAgxgpdHpK
    http://screencast.com/t/pQ8MNtxn (cart button not showing at all here)

    How can I make sure it works and looks the same as on the iPhone 5 portrait on all mobile device sizes? The menu on the right with the cart button to the left of it?

    Thanks.

    #390647

    Hey!

    Try to replace this code with this:

    @media only screen and (max-width: 989px) {
    .html_mobile_menu_tablet .container #advanced_menu_toggle, .html_mobile_menu_tablet #advanced_menu_hide {
    left: 240px;
    }}

    with this:

    @media only screen and (max-width: 989px) {
    .html_mobile_menu_tablet .container #advanced_menu_toggle, .html_mobile_menu_tablet #advanced_menu_hide { right: 80px; } }

    Add this below:

    @media only screen and (max-width: 767px) {
    .html_mobile_menu_tablet .container #advanced_menu_toggle, .html_mobile_menu_tablet #advanced_menu_hide { right: 90px; } }

    Regards,
    Ismael

    #390751

    That messed up the iPhone setup that was good before – http://screencast.com/t/0SZPmBgsb6g – and didn’t fix the other screen sizes:

    http://screencast.com/t/Bsd1HUyDLIPm
    http://screencast.com/t/1onCe7O4x

    #391931

    Hi!

    Please post the login details so that we can check the css code.

    Best regards,
    Ismael

    #392556
    This reply has been marked as private.
    #392992

    Hey!

    Alright. We modified a code a bit. Please check.

    Best regards,
    Ismael

    #393009

    I still see that the menu and cart button are moving and changing location with every screen size. Isn’t there a way to make them show always at the same spot which will be at a certain distance from the right edge of the screen?

    #394172

    Hey!

    Did you check it on actual mobile device? Is there any issue on iPad or iPhone view? Please post a screenshot. Are you trying to reproduce the issue just by resizing the browser window?

    Best regards,
    Ismael

    #394282

    Hi, yes, I checked on an iPad (and it works fine) and also on iPhone 5 and in landscape it looks like this – http://screencast.com/t/k3PtR3N4JRl – and in portrait it looks better but the gap between the menu and cart buttons is a little too wide and the cart button is too close to the logo – http://screencast.com/t/P8SK040XnDD

    #396193

    Hi!

    for me it looks good on iPhone 5 and not like in your screenshots. But try this code:

    @media only screen and (max-width: 767px) {
    .responsive #top .cart_dropdown {
    right: 3.5%;
    }}
    

    Cheers!
    Andy

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