Merging a row has a big problem!!

[Brian]

Hello

I have created 30 tables and all was ok. They are 4 or 5 columns 750px wide. I set non responsive so they simply reduce in width on smaller screens.

HOWEVER if I then need a row that is one cell across, it messes up. The preview is ok, but on my webpage the table suddenly shows half the width it should be, way to narrow.

I checked all the cells and they are all set to Auto, no fixed widths.

This is eating up my hours, I have spent 2 days solid trying to work out what is causing it.

I have one table that HAS 3 rows right across, and 3 columns above and below that row, and it works. Yet if I copy that table and add more 3 column rows, it messes up again.

TBH I am pretty fed up with this, there is a bug here, and it needs resolving please. If this plugin is fit for purpose…..

Bottom of this page – the table has the bug and shows less than half the correct width.

Yet before I added a merged row, it showed just fine.

See:

http://incredibledesign.co.uk/stellawebsite/techdas-insulation-base-2/

The table above it displays ok (same table) but I put the link code into a raw text box. But then and I can’t assign a style / font weight to that. Yet I can type some text, and the style class does work. So the CSS can’t assign to your table link code.

The table thus has to be put into a header box, so I can assign the font / weight.

That works fine, until I merge a row, then it goes to the wrong table width.

If you can not see a way to fix the table bug, can you give me a way to style the table in a basic html box. It is ignoring and CSS I add to that box, no matter what I try.

Here is my CSS rule:
.style88 {font-weight: 300 !important;}

Here is the code I put in the text box (which doesn’t style it):
[wptb id=85096]

[Brian]

I have tried to locate the CSS tag for the table in Firefox – Debug. I found the divs titled as:

<div class=”wptb-table-container wptb-table-85096 wptb-table-container-0″ style=”max-width: 750px;”><div class=”wptb-table-container-matrix”><table class=”wptb-preview-table wptb-element-main-table_setting-84519″ ………. class=”wptb-table-container-matrix”

I have tried to assign a CSS style to the classes but it doesn’t work. The font shows in an ugly bold weight, and I really need to style it as 300 weight.

Anyone?

[Erdem]

Hello Brian,

Sorry to hear you are having this issue. We will investigate it and will give you an update as soon as possible.

Best regards.

[Erdem]

Hello Brian,

We investigated the table you shared, and you enabled disable theme styles for that particular table. And because of this, your custom CSS rules are not affecting the style of the table.

For the width issue, the problem is outside of the plugin. Your theme is forcing a uncount style which has a auto margin setting. This is a bad practice to horizontally center elements inside a container. And also there is a custom max-width style property on the same div container. When coupled with auto margin, this settings limit your table to get the desired width, solid width style property should be used in that instance and auto margin setting should be removed. First please disable the disable theme styles option and test the layout. If this not fix the layout, we can move on to adding some custom CSS rules to fix that theme issues.

For merged issue, can you please share a live example for that issue? Because as it seems, it might also be caused by your theme or another plugin if everything looks good on builder preview.

Location of disable theme styles option: https://ibb.co/ZXVTk17

Table when theme issues are fixed: https://ibb.co/0MMjnQ2

Best regards.

[Brian]

Hello Erdem

Thank you for your investigation.

I have looked again at the issue. I duplicated the table with the merged rows.

Then deleted those merged rows, and set the grey title row text in 2 columns instead, and coloured the 2 columns to replicate the merged rows. But the text is centred over the left column.

All settings are the same for both tables, and in my wordpress page text container as well.

If you see the page, you can see the merged table first, then under it I have placed the unmerged table. The merged table only displays to a narrow width, not my 750px width I have set in WPTable builder for both tables.

So it looks like there is an issue with table width display as soon as a add a merged row. I tried merging 2 columns as a single row, and also adding a new blank row at the bottom merging that, and moving it up to the right position. The result is the same, on my web page, that table now shows to narrow in width.

Do you have an idea what may be causing this? I have minimal plugins activated in the site.

Artesania Audio Range

[Brian]

Hello

I found a table I created earlier, that I added to and it worked ok. I checked all the settings in the original table, and all looked fine. S I think there is a bug that can appear on a row merge for no reason I can see.

I have no alternative but to re-create the problem tables again using my base table that seems to work. It has lost me hours of time……