Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • February 1, 2015 at 11:59 pm #389085
    bakbek

    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.

    February 3, 2015 at 2:50 am #389818
    Andy

    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

    February 3, 2015 at 9:48 am #389907
    bakbek

    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.

    February 4, 2015 at 11:09 am #390647
    Ismael

    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

    February 4, 2015 at 2:58 pm #390751
    bakbek

    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

    February 6, 2015 at 11:39 am #391931
    Ismael

    Hi!

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

    Best regards,
    Ismael

    February 7, 2015 at 7:28 pm #392556
    bakbek
    This reply has been marked as private.
    February 9, 2015 at 12:57 pm #392992
    Ismael

    Hey!

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

    Best regards,
    Ismael

    February 9, 2015 at 1:21 pm #393009
    bakbek

    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?

    February 11, 2015 at 10:03 am #394172
    Ismael

    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

    February 11, 2015 at 12:57 pm #394282
    bakbek

    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

    February 14, 2015 at 6:54 pm #396193
    Andy

    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

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