Return to previous page

Some Checkout page lines displaying incorrectly on mobile phone

This topic has 6 replies, 3 voices, and was last updated 8 years, 9 months ago ago by Jack Richardson

Michael

Participant

July 9, 2015 at 11:08

Hi,
When I view the checkout page on a Nexus 5 mobile phone there’s an issue with the ‘Enter Coupon code’ and ‘Cost before shipping’ lines.

‘Enter Coupon code’.
(1) On your demo site when viewed in portrait mode the input field for ‘Enter Coupon code’ is too far to the right and therefore truncated.

(2) On your demo site when viewed in landscape mode the ‘Enter Coupon code’ line seems to be right justified – it might look better on the left?

‘Cost before shipping’
(1) On your demo site when viewed in portrait mode the ‘Cost before shipping’ price is not visible at all. On my site it’s truncated the right hand side ie. I see $31. instead of $31.90.

(2) On your demo site and my website when viewed in landscape mode the ‘Cost before shipping’ line seems to be right justified – it might look better on the left?

Regards,
Mike.

Please, contact administrator
for this information.

#74196 Copied

5 Answers

Eva Kemp

Support staff

July 9, 2015 at 13:31

Hello,

Could you please show us screenshots of the issues you have on your site?

Thank you.
Regards,
Eva Kemp.

#74279 Copied

Michael

Participant

July 10, 2015 at 00:58

Hi Eva,

You can view a scan of my mobile phone displaying the Blanco demo checkout page here http://wpbugs.com/wp-content/uploads/2015/07/Blanco-Cart-Issue.jpg

As can be seen the coupon input box is truncated at the right hand side and the cost before shipping $ amount is totally missing.

Regards,
Mike.

#74383 Copied
Jack Richardson

Support staff

July 10, 2015 at 12:05
Hello,

Try to use the following css code in custom.css:
```
.wpsc_total_amount_before_shipping .pricedisplay {
margin-left: -30px !important;
}
```
To create custom.css you need rename default.custom.css to custom.css in wp-content/themes/blanco directory via FTP and enable it in Blanco – Theme Settings, tick “Enable Custom CSS file”.

Best regards,
Jack Richardson.
#74470 Copied
Michael

Participant

July 13, 2015 at 06:24

Hi Eva,
That seems to be working OK.
I needed to increase it to -50px so it would correctly display orders over $1000.00 on my mobile phone.

Please go ahead and close this topic.

Thanks,
Mike,

#74731 Copied

Jack Richardson

Support staff

July 13, 2015 at 07:13

Hello,

You are welcome!

Best regards,
Jack Richardson.

#74733 Copied
Viewing 6 results - 1 through 6 (of 6 total)

The issue related to '‘Some Checkout page lines displaying incorrectly on mobile phone’' has been successfully resolved, and the topic is now closed for further responses

Some Checkout page lines displaying incorrectly on mobile phone

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection