Tables

If you have the latest version of Publii, are using one of the Publii themes from https://marketplace.getpublii.com/themes/  and create your web pages using the WYSIWYG editor, you can use the ‘Table’ button to easily create and edit a data table, set the number of columns, rows, styling, etc. So that’s the easy way.

If you wanted to customize your table precisely, you can choose the ‘Source code’ button, and edit the HTML code, if you’re familiar with that. For example, usually be default, table width is set to 100%, so you can change that to another value, say 85%. You can set column widths too by editing the HTML. Or if you have the code for an entire table you want already defined, you could try copying and pasting that into your source code to replace the entire existing table.

The documentation page is at: The WYSIWYG editor page at: https://getpublii.com/docs/post-editor.html#insertingtables

Some ‘standard’ data table options shown for the ProDocs theme at: https://demo.getpublii.eu/themes/prodocs/table/

@themuttsknutts

To run a quick test, I’ve just temporarily copied and pasted your <table> …. </table> code into both a Publii Simple theme and an Art Gallery theme, and both display your table data (images, headings, text, rows, columns, etc) okay both for desktop and mobile (responsive) views. On desktop display: Simple theme table width = 866px, Art Gallery theme table width = 823px. So this suggests your problem is elsewhere.

Your page at: https://cluckin.net/the-complete-list-of-chicken-colours-with-pictures-video-and-breed-examples.html has a lot going on, ads, iframes, customisation, etc. Perhaps one approach is to create another test copy of your site in Publii, then remove all the ads, iframes, any other customisation of whatever Publii theme you’re using. Or, alternatively create a new test Publii site with your original Publii theme, then copy and paste your <table> …. </table> code into a new test page and test the display. That will probably display okay. Then step by step add in elements to your site and test each display to help identify where it’s goes wrong.

Many thanks. white-space: normal} works a dream. </span>