|
sky
|
January 10, 2020 at 8:56 am
Hi guys
I still have a problem with the table (cart) on mobile view. It’s not responsible and just a part of the table is visible.
Attached is a picutre.
As well the buttons stick one on the other and it looks not so nice. Would be good to have a small space between the buttons.
Also a picutre of that situation.
Would be great to get your help.
Thank you
Cristina
http://www.skydesign.ch/neudikids_neu/wp-content/uploads/2020/01/TABLE_MOBILE_VIEW_01.png
http://www.skydesign.ch/neudikids_neu/wp-content/uploads/2020/01/BUTTONS_MOBILE_VIEW.png
|
|
Josh
|
January 10, 2020 at 6:57 pm
Hi Cristina,
Quite likely the issues are related to the active WordPress theme. Have you checked the cart on mobile view with another theme like one of the default WordPress twenty* themes activated?
In any case, we can help you put together some CSS that will override the theme’s CSS to make the cart items fit better on smaller screens. Can you share a link to an event on the site where we can add tickets to the cart?
|
|
Josh
|
January 10, 2020 at 7:33 pm
I found an event on your site. Here’s some CSS that will help everything fit better in the cart when it’s a small screen:
@media screen and (max-width : 800px){
.event-cart-grand-total a.event-cart-button {
margin-top:2em;
}
.event-cart-button.button {
display: block;
margin-top: 1em;
}
.wpb_text_column .event-cart-tbl span.dashicons {
font-size: 16px;
}
.event-cart-tbl td {
padding: 5px 5px;
}
.event-cart-tbl tbody tr td,
.wpb_text_column .event-cart-tbl :last-child {
font-size: 14px;
}
#event-cart {
margin-left: -20px
}
}
|
|
sky
|
January 12, 2020 at 7:52 am
Hi Josh
Thanks for your feedback.
My problem is: All tables (Registration, cart after registration) fits perfect with mobile – just the first cart-table doesn’t fits.
Look, I send you a printscreen of the cart:
Cart Mobile-view
I remember I had the same problem for the registration-table and there you helped me with a css-code. After adding the code, it looked perfect.
Thanks for your help
Cristina
|
|
Josh
|
January 13, 2020 at 7:25 am
Hi,
I’m afraid the screenshot URL you’ve shared returns a 404 not found error.
|
|
sky
|
January 16, 2020 at 8:04 am
Table view on Mobile
|
|
Josh
|
January 17, 2020 at 8:07 am
So of the CSS was still overridden. Can you change this from above:
.event-cart-button.button {
display: block;
margin-top: 1em;
}
to this?
#event-cart-tbl .event-cart-button.button {
display: block;
margin-top: 1em;
}
|
|
sky
|
January 18, 2020 at 3:57 pm
Hi Josh
Still not showing the full table, but it’s better than before:)
Thanks for your help!
Cristina
|
|
Josh
|
January 21, 2020 at 8:39 am
I checked and the full table shows on my iPhone
https://slack-files.com/T02SY781D-FSWT4KMGC-de405a8af8
Maybe there’s a specific event that has longer text which pushes the table out of view? If that’s the case, if you can share the URL for that event we can investigate further.
|
