Responsive Table w/ custom CSS is changing text alignment on an X Pro page

Support
#1

Since I couldn’t find a good way to set up a responsive table onsite, I tried using a piece of code from offsite to do it, and then just put it in a page as text with its custom css and javascript added to the global settings. Here’s what it’s supposed to look like:

And here’s what it does at mobile small screens:

This is the Codepen where you can see the guts: Responsive Product Comparison Table

However, when I put the html in this page on an X Pro site, it breaks and the text spacing is messed up: http://emergencyadapters.io/test-compare/

So the alignment of the first row changes to the Left on X where it is Center in CodePen…

Any clue why this isn’t working for me? I’ve been playing around with this all day and it must be something on the X Pro side…

#2

Hello @quantazelle,

Thanks for asking. :slight_smile:

It looks like you have deleted the test compare page. However if you want to display data in a tabular format, rather than using custom codes I suggest you to take a look at following plugin:

  1. Download source: https://wordpress.org/plugins/tablepress/
  2. Documentation: https://tablepress.org/documentation/

Thanks.

#3

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.