Woocommerce checkout page problems

  • Hi guys,

    Great theme, but there are some major styling issues with the Woocommerce checkout page. There must be some CSS somewhere that is conflicting with the standard Woocommerce styling. Can you have a look at it? The problems occur on your demo website (https://afterimagedesigns.com/wp-bootstrap-starter/woo-commmerce/checkout/) as well as on my website.

    I’m going to investigate it myself today and if I find the culprit(s) I will post a solution here for others.

    Cheers, Paul

    The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)
  • Theme Author Afterimage Designs

    (@afterimagedesigns)

    Hi @pa_esp,

    Thank you for using WP Bootstrap Starter theme, please update to the latest theme version to fix the issue.

    Thread Starter pa_esp

    (@pa_esp)

    Hi guys,

    Thanks for your reply. Unfortunately the update doesn’t solve the problem. In fact the update removes Bootstrap row classes and uses Woocommerce responsive class instead (which is worse for me).

    However, I worked out the problem. The reason that the checkout page looked messy was that there was this CSS style:

    .form-row {
   display: flex;
}

    Flexbox was messing up the form so I added the following to my child theme CSS:

    .woocommerce-billing-fields .form-row, .woocommerce-shipping-fields .form-row {
	display: block;
}

    This has solved my problem.

    Cheers!

    • This reply was modified 6 years, 5 months ago by pa_esp.

    I have the same problems with you , the shipping fields layout is msessy in display.

    Thread Starter pa_esp

    (@pa_esp)

    @allense2018 – Add the code I have shown to a CSS file. Here it is again:

    .woocommerce-billing-fields .form-row, .woocommerce-shipping-fields .form-row {
	display: block;
}

    Hopefully this will solve your problem. If it doesn’t, reply to this post and I will have another look at my code. The authors may have changed their code since I last corrected this error.

    Cheers, Paul

    @pa_esp
    Hi Paul
    Thanks so much for your help, I’ve add your code to the page builder custom css and it works.

    Cheers, steven

    • This reply was modified 6 years, 3 months ago by allense2018.
    Thread Starter pa_esp

    (@pa_esp)

    Hi Steven,

    Brilliant! I’m glad it works okay ?? I’m very pleased I could help.

    Cheers, Paul

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Woocommerce checkout page problems’ is closed to new replies.