content CSS class causes align attibute on td/th to be ignored

[aner-perez]

This is about Bulma.

This is a bug in the CSS

Overview of the problem

This is about the Bulma CSS framework

I am sure this issue is not a duplicate

Description

When including pre-formatted content in a container with the content CSS class applied, the tables in the pre-formatted content ignore the align="right" or align="center" attributes when applied to td/th tags. All table cells are left aligned.

In my case, this was encountered while using the marked markdown library to render pre-formatted HTML.

Steps to Reproduce

<div class="content">
  <table>
    <tr>
      <th align="right">Right</th><th align="center">Center</th><th align="left">Left</th>
    </tr>
    <tr>
      <td align="right">Right</td><td align="center">Center</td><td align="left">Left</td>
    </tr>
  </table>
</div>

Expected behavior

Table cells inside a content block should respect the align attribute for cells.

Actual behavior

All table cells inside a content block are left aligned regardless of the align attribute applied.

Workaround

Adding the following CSS allows the align attribute to be respected.

.content td[align="right"],
.content th[align="right"]{
    text-align: right;
}
.content td[align="center"],
.content th[align="center"] {
    text-align: center;
}

This happens not only in these circumstances, but with every td and th.

[Maxhodges]

how about #1325