<table>'s background is set on the text style and not on the whole table cell #330
Description
I have HTML like below:
<table>
<colgroup>
<col width="30%"/>
<col width="70%"/>
</colgroup>
<tr>
<th>AAAAAAAAAAAAAAAAAAAAAAAAAAAA</th>
<td>B</td>
</tr>
<tr>
<th>A</th>
<td>BBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBB</td>
</tr>
</table>And my styles are like this:
final Map<String, Style> htmlStyles = {
'table': Style(
backgroundColor: MyColors.backGroundColor,
border: Border.all(color: MyColors.surfaceOverlay),
),
'th': Style(
display: Display.INLINE,
alignment: Alignment.center,
backgroundColor: MyColors.lightGrey,
padding: const EdgeInsets.all(8),
),
'td': Style(
display: Display.INLINE,
backgroundColor: MyColors.backGroundColor,
padding: const EdgeInsets.all(8),
),
};Then the screen would be:
But I expected the left-bottom cell (having 'A') to expand to the table's bottom line. Its height is just the same as its text-height.
Please let me know if there's any workaround or I went wrong.