I read the documentation here about using the Grid Table style when creating a table to display some information via Sphinx document generator. However, my gride table does not behave when formatted. Any ideas why?
+----------------------------------------------------------------------------------------------------------+-------------+--------------------+-----------------------------+
| Element Selector | data-* | data-neuro-* value | Combined |
+----------------------------------------------------------------------------------------------------------+-------------+--------------------+-----------------------------+
| #loanOfferSection > div.application-form-section__container > div > form > | data-button | loMonthly | data-button='loMonthly' |
| div.lo.lo__all-offers > div.lo__sortable-header > button.lo__sortable-header--monthly.selected-sort.desc | | | |
+----------------------------------------------------------------------------------------------------------+-------------+--------------------+-----------------------------+
| #loanOfferSection > div.application-form-section__container > div > form > | data-button | loSortBtn | data-button='loSortBtn' |
| div.lo.lo__all-offers > div.lo__sortable-header > button.lo__sortable-header--apr.desc | | | |
+----------------------------------------------------------------------------------------------------------+-------------+--------------------+-----------------------------+
| #loanOfferSection > div.application-form-section__container > div > form > | data-button | loInterest | data-button='loInterest' |
| div.lo.lo__all-offers > div.lo__sortable-header > button.lo__sortable-header--interest-paid.desc | | | |
+----------------------------------------------------------------------------------------------------------+-------------+--------------------+-----------------------------+
| #loanOfferSection > div.application-form-section__container > div > form > | data-button | loTerm | data-button='loTerm' |
| div.lo.lo__all-offers > div.lo__sortable-header > button.lo__sortable-header--term-length.desc | | | |
+----------------------------------------------------------------------------------------------------------+-------------+--------------------+-----------------------------+
| #loanOfferSection > div.application-form-section__container > div > form > | data-region | loFees | data-region='loFees' |
| div.lo.lo__all-offers > div.lo__sortable-header > div.lo__sortable-header--fees | | | |
+----------------------------------------------------------------------------------------------------------+-------------+--------------------+-----------------------------+
| #loanOfferSection > div.application-form-section__container > div > form > | data-region | loCall | data-region='loCall' |
| div.lo.lo__all-offers > a > div > p | | | |
+----------------------------------------------------------------------------------------------------------+-------------+--------------------+-----------------------------+
| #loanOfferSection > div.application-form-section__container > div > form > | data-button | LoanOptionBtn | data-button='LoanOptionBtn' |
| div.lo__drawer-container > div > button | | | |
+----------------------------------------------------------------------------------------------------------+-------------+--------------------+-----------------------------+
| #loanOfferSection > div.application-form-section__container > div > form > | data-region | CopyText | data-region='CopyText' |
| div.lo__drawer-container.show-drawer > div > div.lo__legal-copy | | | |
+----------------------------------------------------------------------------------------------------------+-------------+--------------------+-----------------------------+
I would like the Element Selector cells to be short enough that I don't have to scroll horizontally when the docs are generated, but I can't even view it because I get the following error: '(ERROR/3) Malformed table' when I run my make html to create my docs.
You've got a strange invisible character in the first row and column, preceding the word "Element". Delete that invisible character, and the table should render.
However I don't think grid tables support column width except when you wrap each cell's content to the relative desired width. With csv tables, you can use the :widths: attribute to specify how many characters should appear in each column, something like this:
.. table:: my table description
:widths: 40, 10, 15, 30