Skip to content

Paragraph formatting in table cells is different when the a style operator is applied #193

@eric-schneider

Description

@eric-schneider

Applying the AsciiDoc style operator (a), either to an individual cell or a whole column, affects the spacing between paragraphs (and perhaps more; see #111).

Image

Steps to reproduce the bug

Add the following syntax example to an adoc file:

AsciiDoc syntax example
[cols="1,1,2"]
|===
|Serverless (Vector) databases |Serverless (Non-Vector) databases |Description

|Document or row
|Row
|A contiguous piece of data, having one or more properties (values), that is stored in a collection or table in a database.

Documents belong to collections, and document properties are stored in _fields_.

Rows belong to tables, and row properties are stored in _columns_.

|Field or column
|Column
|The individual values, properties, or attributes that make up a complete document or row of data.
For example, a table containing purchase history for an online store might include values like `name`, `address`, `customer_id`, `purchase_date`, and `order_id` in each row.

Properties can be stored as various data types, like text, numbers, arrays, dates, booleans, and vectors.
|===


[cols="1,1,2a"]
|===
|Serverless (Vector) databases |Serverless (Non-Vector) databases |Description

|Document or row
|Row
|A contiguous piece of data, having one or more properties (values), that is stored in a collection or table in a database.

Documents belong to collections, and document properties are stored in _fields_.

Rows belong to tables, and row properties are stored in _columns_.

|Field or column
|Column
|The individual values, properties, or attributes that make up a complete document or row of data.
For example, a table containing purchase history for an online store might include values like `name`, `address`, `customer_id`, `purchase_date`, and `order_id` in each row.

Properties can be stored as various data types, like text, numbers, arrays, dates, booleans, and vectors.
|===

The syntax example contains two near-identical tables. The only difference is that the second table has the AsciiDoc a operator applied to the cells in the 3rd column.

Generated HTML

Without a:

<table class="tableblock frame-all grid-all stripes-hover stretch">
<colgroup>
<col style="width: 25%;">
<col style="width: 25%;">
<col style="width: 50%;">
</colgroup>
<thead>
<tr>
<th class="tableblock halign-left valign-top">Serverless (Vector) databases</th>
<th class="tableblock halign-left valign-top">Serverless (Non-Vector) databases</th>
<th class="tableblock halign-left valign-top">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Document or row</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">Row</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">A contiguous piece of data, having one or more properties (values), that is stored in a collection or table in a database.</p>
<p class="tableblock">Documents belong to collections, and document properties are stored in <em>fields</em>.</p>
<p class="tableblock">Rows belong to tables, and row properties are stored in <em>columns</em>.</p></td>
</tr>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Field or column</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">The individual values, properties, or attributes that make up a complete document or row of data.
For example, a table containing purchase history for an online store might include values like <code>name</code>, <code>address</code>, <code>customer_id</code>, <code>purchase_date</code>, and <code>order_id</code> in each row.</p>
<p class="tableblock">Properties can be stored as various data types, like text, numbers, arrays, dates, booleans, and vectors.</p></td>
</tr>
</tbody>
</table>

With a:

<table class="tableblock frame-all grid-all stripes-hover stretch">
<colgroup>
<col style="width: 25%;">
<col style="width: 25%;">
<col style="width: 50%;">
</colgroup>
<thead>
<tr>
<th class="tableblock halign-left valign-top">Serverless (Vector) databases</th>
<th class="tableblock halign-left valign-top">Serverless (Non-Vector) databases</th>
<th class="tableblock halign-left valign-top">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Document or row</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">Row</p></td>
<td class="tableblock halign-left valign-top"><div class="content"><div class="paragraph">
<p>A contiguous piece of data, having one or more properties (values), that is stored in a collection or table in a database.</p>
</div>
<div class="paragraph">
<p>Documents belong to collections, and document properties are stored in <em>fields</em>.</p>
</div>
<div class="paragraph">
<p>Rows belong to tables, and row properties are stored in <em>columns</em>.</p>
</div></div></td>
</tr>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Field or column</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">Column</p></td>
<td class="tableblock halign-left valign-top"><div class="content"><div class="paragraph">
<p>The individual values, properties, or attributes that make up a complete document or row of data.
For example, a table containing purchase history for an online store might include values like <code>name</code>, <code>address</code>, <code>customer_id</code>, <code>purchase_date</code>, and <code>order_id</code> in each row.</p>
</div>
<div class="paragraph">
<p>Properties can be stored as various data types, like text, numbers, arrays, dates, booleans, and vectors.</p>
</div></div></td>
</tr>
</tbody>
</table>

You can see in the HTML that in cells without the a operator applied, paragraphs are generated like so:

<p class="tableblock">A contiguous piece of data, having one or more properties (values), that is stored in a collection or table in a database.</p>

Whereas in cells with the a operator applied, elements are generated as divs:

<div class="content"><div class="paragraph">
<p>A contiguous piece of data, having one or more properties (values), that is stored in a collection or table in a database.</p>

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No fields configured for Bug.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions