Return to previous page

Topic: Responsive Checkout Order Review Overlapping

Tagged: checkout

misswp

Participant

November 30, 2015 6:11 am

Hi,

I attach a screenshot of how the checkout page is looking on Mobile. You can see it is overlapping again. I had this issue with the overlap of delivery section on left in Checkout page, into the place order box on the right, and it’s happening again with the latest theme update.
It was fixed originally with the custom css >
@media (max-width: 480px) {.order-review {
margin-top: 108px !important;
}}

Now that is not working for phone & ipad. See screenshot and please advise a fix?

Thank you in advance.
Theme version: latest
WooCommerce version: 2.4.10

Content is visible for topic creator and
support staff only.

#101871 copied to clipboard

Like
Eva Kemp

Support staff

November 30, 2015 10:23 am
Hello,

Please remove the previous code and add this one in Theme Options > Custom CSS > Custom CSS for mobile:

.order-review { margin-top: 208px !important; }

Regards,
Eva Kemp.
#101905 copied to clipboard

Like
misswp

Participant

November 30, 2015 8:51 pm

Thank you for the answer, however this hasn’t made any difference at all.
Even after clearing the cache.

Thanks.

#102032 copied to clipboard

Like

misswp

Participant

November 30, 2015 8:52 pm

Also adding to this the order review box is fine on computer and laptop, I just need to stop it overlapping the last two colums on mobile and tablet. Please see my screenshot (link was attached to original post).

Thanks.

#102035 copied to clipboard

Like

misswp

Participant

November 30, 2015 9:00 pm

Okay, I fixed it with the following, but I’ve put it straight on child theme, not the custom css on theme options 🙂

@media (max-width: 480px) {.order-review {
margin-top: 208px !important;
}}
Would you have a fix for the arrows on the shopping system please, as I have updated the theme to the latest and on your demos they are beautiful flat arrows (on single product pages and cart) for choosing the amount of products and even though I updated I have the old looking arrows.

Thanks a mil.

#102040 copied to clipboard

Like

Eva Kemp

Support staff

November 30, 2015 9:14 pm

Hello,

I don’t see any problems now:
http://storage6.static.itmages.com/i/15/1130/h_1448914427_5140098_70aa705b2a.png

Try to check in another browser and even other Internet provider.

Thank you.

Regards,
Eva Kemp.

#102046 copied to clipboard

Like

misswp

Participant

December 5, 2015 1:40 am

Thanks Eva, yes correct, as I above my message said that I had fixed it by putting the code into the child theme.

Would you now have a fix for the following as requested above. 🙂

Would you have a fix for the arrows on the shopping system please, as I have updated the theme to the latest and on your demos they are beautiful flat arrows (on single product pages and cart) for choosing the amount of products and even though I updated I have the old looking arrows.

Thanks a mil.

#102855 copied to clipboard

Like

Robert Hall

Support staff

December 5, 2015 8:24 am

Hello,

WooCommerce has removed that feature in the recent update and replaced it with the number input type.
You may try https://wordpress.org/plugins/woocommerce-quantity-increment/ plugin

Regards,
Robert Hall.

#102864 copied to clipboard

Like

Viewing 8 results

1 through 8 (of 8 total)

You must be logged in to reply to this topic.Log in/Sign up

Topic: Responsive Checkout Order Review Overlapping

Usefull links

Did you know ?

Support Stats

Topic: Responsive Checkout Order Review Overlapping

Usefull links

Did you know ?

Support Stats

Log in to 8theme

Oops, looks like you don’t have access!

Please, enter the appropriate Envato purchase code below to create a topic on current forum