CSS Styling Table Plugin - full width tables

I'm using the square websites custom table block plugin.

I'm trying to recreate my tables, but pulling the information from google sheets. 

The 3 tables on the top are SQUARESPACE. The 3 tables on the bottom are pulling from GOOGLE SHEETS.

I want the GOOGLE SHEET tables to re-size and stretch like the native SQUARESPACE ones. The GOOGLE SHEETS tables have a class of "pricetables"

https://www.brownleepress.com/postcards

I see both looks same. Can you describe in more detail?

When I resize my screen, to simulate different screen sizes, the tables function differently. The SquareSpace tables (TOP) is how I would like it to look. The imported tables (BOTTOM), spill into each other and won't hold at 100% with a gap. I'm thinking the container that the imported tables are in must not have a specified width or at least not be set in the way that the TOP tables are

I'm struggling a little bit now with getting the tables to stretch to 100% on mobile.

The fix for the other stuff was fiddling around with the plugins internal settings. There are a few options for the table's basic look, and I ended up going with 1 of the 2 settings for "full width." The setting that I chose had a little tag on there that says "use this one if you're having issues with tables overlapping" (which I was). 

Other than that, I just made some basic tweaks to the css. Truth be told, I'm not sure if these are fixes for the default or if I am just overriding styles that I've written for other pieces, but these helped when added to the specific table:

  width:100%!important;
  white-space: pre-wrap!important;
  table-layout: auto!important;

If anyone can help me with getting this thing to stretch to 100% wide in mobile, it'd be greatly appreciated.

Hi Bill,
Were you able to solve this? Table block plugin's styling options are limited from the UI window. However, it's customizable if you apply CSS on it.
You can adjust any part of the table you want with CSS.