Squished display on mobile

[Martin]

Was just checking out the display for registration on a mobiel and the text is all squished. Is there a way by CSS to allow the parts to fall under each other, title then number of tickets, price and description.instead of right beside each other? Thank you for your help.

https://mcwe.com/event/46th-annual-world-conference/

[Martin]

Here is a screenshot of the problem

[Geoff B.]

Good evening Martin and welcome back!

Thank you for reaching out to us.

We are sorry to hear about
I would love to help you with this topic.

Try adding the following CSS rule to your style.css file or in your Custom CSS metabox:

@media only screen and (max-width: 640px) {
table.tribe-events-tickets tr .woocommerce, table.tribe-events-tickets tr .tickets_description, table.tribe-events-tickets tr .tickets_name,
table.tribe-events-tickets tr .tickets_price {
width: 100% !important;
}
}

Let me know if that helps.

Have a great day!

Geoff B.

[Martin]

That worked perfectly. Thank you.

[Geoff B.]

Good afternoon Martin,

I am super stoked that this worked out for you.

You are welcome back in our support forums any time 🙂

For now, I am going to close this thread.

Have a great week!

Geoff B.

[Author]

Posts