Weird formatting on mobile Add To Cart Form

[KCRQFwebsite]

We have composite products & box office both added onto this woocommerce site. So there is a lot happening in the Add To Cart Form.

I can’t edit it within cornerstone itself… and trying to figure out where to tweak the CSS to get the mobile view looking nice.

I’ve tried this code - it renders on chrome dev tools small but not on a real ios iPhone.

@media (max-width:767px) {
.wc-box-office-ticket-fields-body label {
font-size: 1rem !important;
font-weight: bold;
}
}

page - https://kcrqf.com/product/2025-single-day-festival-ticket/#review

I’ve currently taken the code out - I may just be putting it in the wrong place. Woocommerce support (who supplies both plugins) helped but is stumped - they think something in the theme is taking a higher priority.

Thanks!!

[ruenel]

Hello @KCRQFwebsite,

Thanks for writing in! It seems that your Event Add to Cart Form is missing some mobile styling. Could you please provide what Event addon are you using? We would love to check your site and your plugin settings. You can create a secure note in your next reply with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
– Confirmation that we can access and make changes to your site

To know how to create a secure note, please check this out: How The Forum Works

Best Regards.

[KCRQFwebsite]

Secure note added. We are using Woocommerce Box Office for the ticketing & also pairing it with Woocommerce Composite product to lump together different options more seamlessly (ie - a ticket with a unique entry barcode for every day in a 3day pass or in this case a ticket for the event plus a ticket for the early bird tour).

The weird formatting seems to be from the box-office-ticket-form div class. Works great on desktop.

[tristup]

Hi @KCRQFwebsite,

It seems that the 3rd Party plugin is adding a few more fields to the Add to Cart form element without proper styling through the CSS. I would suggest you contact the Plugin Author on this.
Alternatively, you can avail of our newly launched service called One, where we answer questions beyond normal theme support, or One TOTAL CARE service, where we offer small customizations.

Thanks

[KCRQFwebsite]

The plugin author is who I started with.

[tristup]

Hi @KCRQFwebsite,

In that case, you need to add the custom CSS code to fix the problem. Please remember that the custom coding is beyond the scope of Theme Support, and as suggested you can avail of our newly launched service called One, where we answer the questions beyond normal theme support.

Thanks