HTML Validation errors
-
Hi – first of all great plugin, really helped us out being able to add more than just standard text in table cells. We’re getting some HTML validation errors and wondered if you knew how we could resolve? For example:
Error:?The?width?attribute on the?col?element is obsolete.?Use CSS instead.<colgroup><col width="" style="min-width:;"/><col wError:?CSS:?min-width: Parse Error.width:;"/><col width="" style="min-width:;"/><col wFrom what I can tell this is coming form an empty
<colgroup>which is the first direct child of the<table>Any ideas on how to resolve?
Many thanks,
Dan
-
Hi @danielwroberts ,
We couldn’t recreate the issue from our end.
Can you please share a link where we can check your table?
RegardsHi – I can’t share a link as the project isn’t live yet but here is a copy and paste of the outputted HTML. If there’s an alternative way to do an export of the table settings then let me know and I’ll do that.
<div class="wp-block-tableberg-wrapper wp-block-tableberg-table">
<table class="" style="border-spacing: 0 0; border-width: 1px; border-color: #000000; border-collapse: collapse; ">
<colgroup>
<col width="" style="min-width:;">
<col width="" style="min-width:;">
<col width="" style="min-width:;">
<col width="" style="min-width:;">
<col width="" style="min-width:;">
<col width="" style="min-width:;">
</colgroup>
<tbody>
<tr class=" tableberg-header">
<th data-tableberg-row="0" data-tableberg-col="0" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0">header</p>
</th>
<th data-tableberg-row="0" data-tableberg-col="1" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0">header</p>
</th>
<th data-tableberg-row="0" data-tableberg-col="2" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0">header</p>
</th>
<th data-tableberg-row="0" data-tableberg-col="3" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0">header</p>
</th>
<th data-tableberg-row="0" data-tableberg-col="4" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0">header</p>
</th>
<th data-tableberg-row="0" data-tableberg-col="5" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0">header</p>
</th>
</tr>
<tr>
<td data-tableberg-row="1" data-tableberg-col="0" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"><strong>Nunc nonummy metus</strong></p>
</td>
<td data-tableberg-row="1" data-tableberg-col="1" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"><strong>Nunc nonummy metus</strong></p>
</td>
<td data-tableberg-row="1" data-tableberg-col="2" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"><strong>Nunc nonummy metus</strong></p>
</td>
<td data-tableberg-row="1" data-tableberg-col="3" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"><strong>Nunc nonummy metus</strong></p>
</td>
<td data-tableberg-row="1" data-tableberg-col="4" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"><strong>Nunc nonummy metus</strong></p>
</td>
<td data-tableberg-row="1" data-tableberg-col="5" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"><strong>Nunc nonummy metus</strong></p>
</td>
</tr>
<tr>
<td data-tableberg-row="2" data-tableberg-col="0" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p>Donec pede justo, fringilla </p>
</td>
<td data-tableberg-row="2" data-tableberg-col="1" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"></p>
<p>Donec pede justo, fringilla vel, aliquet nec, vulputate .</p>
</td>
<td data-tableberg-row="2" data-tableberg-col="2" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"></p>
<p>Donec pede justo, fringilla </p>
</td>
<td data-tableberg-row="2" data-tableberg-col="3" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"></p>
<p>Donec pede justo, fringilla m eget dui.</p>
</td>
<td data-tableberg-row="2" data-tableberg-col="4" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"></p>
<p>Donec pede justo, fringilla </p>
</td>
<td data-tableberg-row="2" data-tableberg-col="5" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"></p>
<p>Donec pede justo, fringilla </p>
</td>
</tr>
<tr>
<td data-tableberg-row="3" data-tableberg-col="0" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. </p>
</td>
<td data-tableberg-row="3" data-tableberg-col="1" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"></p>
</td>
<td data-tableberg-row="3" data-tableberg-col="2" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"></p>
</td>
<td data-tableberg-row="3" data-tableberg-col="3" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"></p>
</td>
<td data-tableberg-row="3" data-tableberg-col="4" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"></p>
</td>
<td data-tableberg-row="3" data-tableberg-col="5" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"></p>
</td>
</tr>
<tr>
<td data-tableberg-row="4" data-tableberg-col="0" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p>Donec pede justo, fringilla </p>
</td>
<td data-tableberg-row="4" data-tableberg-col="1" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0">ligula, eget egestas libero turpis vel mi.</p>
<ul>
<li>Aenean commodo ligula</li>
<li>Aenean commodo ligula</li>
<li>Aenean commodo ligula</li>
<li>Aenean commodo ligula</li>
<li>Aenean commodo ligula</li>
<li>Aenean commodo ligula</li>
</ul>
</td>
<td data-tableberg-row="4" data-tableberg-col="2" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"></p>
</td>
<td data-tableberg-row="4" data-tableberg-col="3" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"></p>
</td>
<td data-tableberg-row="4" data-tableberg-col="4" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"></p>
</td>
<td data-tableberg-row="4" data-tableberg-col="5" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"></p>
</td>
</tr>
<tr>
<td data-tableberg-row="5" data-tableberg-col="0" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p>Donec pede justo, fringilla </p>
</td>
<td data-tableberg-row="5" data-tableberg-col="1" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"></p>
</td>
<td data-tableberg-row="5" data-tableberg-col="2" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"></p>
</td>
<td data-tableberg-row="5" data-tableberg-col="3" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"></p>
</td>
<td data-tableberg-row="5" data-tableberg-col="4" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"></p>
</td>
<td data-tableberg-row="5" data-tableberg-col="5" style=""
class="wp-block-tableberg-cell tableberg-v-align-center">
<p style="margin-top:0;margin-bottom:0"></p>
</td>
</tr>
</tbody>
</table>
</div>@danielwroberts could you please share with us how you validated the HTML?
Hi – using the W3 Markup Validation Service – https://validator.w3.org/nu/#textarea
I’ve pasted the table output into a basic HTML page and then pasted that into the direct input validation tab.
Hi @danielwroberts,
We’ve addressed the CSS parse error you encountered, and the fix will be included in the next version of tableberg.
Regarding the obsolete attribute warning, while the
widthattr in<col>elements are considered obsolete in the HTML specification, they are still widely supported by browsers. We currently do not plan to change this unless it causes an actual functionality issue.If you encounter any other issues or have further questions, please let us know!
Ok thanks, do you know when the next version of tableberg will be released?
A new version has been released.
That’s great, thanks for all the help.
Hi @danielwroberts,
If you’re satisfied with the plugin and support, please take a moment to share your experience by leaving a review here.
Thanks & Regards
Istiak
- You must be logged in to reply to this topic.
