README - Mjml — ContextQMD

mj-table

Display a data table. It only accepts plain HTML.

xml

<mjml>
  <mj-body>
    <mj-section>
      <mj-column>
        <mj-table>
          <tr style="border-bottom:1px solid #ecedee;text-align:left;padding:15px 0;">
            <th style="padding: 0 15px 0 0;">Year</th>
            <th style="padding: 0 15px;">Language</th>
            <th style="padding: 0 0 0 15px;">Inspired from</th>
          </tr>
          <tr>
            <td style="padding: 0 15px 0 0;">1995</td>
            <td style="padding: 0 15px;">PHP</td>
            <td style="padding: 0 0 0 15px;">C, Shell Unix</td>
          </tr>
          <tr>
            <td style="padding: 0 15px 0 0;">1995</td>
            <td style="padding: 0 15px;">JavaScript</td>
            <td style="padding: 0 0 0 15px;">Scheme, Self</td>
          </tr>
        </mj-table>
      </mj-column>
    </mj-section>
  </mj-body>
</mjml>

<div class="alert alert-note" role="alert"> <p>Note</p> <p><code>mj-table</code> is an "ending tag", which means that it can contain HTML code but it cannot contain other MJML components. Therefore, it will accept any tag you would add inside an HTML table tag.</p> <p>More information about ending tags <a href="#ending-tags">in this section</a>.</p> </div>

Attributes

attribute	accepts	description	default value
align	`left` `right` `center`	table horizontal alignment	`left`
border	string	CSS border format	`none`
cellpadding	integer	space between cells	`0`
cellspacing	integer	space between cell and border	`0`
color	CSS color formats	text header & footer color	`#000000`
container-background-color	CSS color formats	inner element background color
css-class	string	class name, added to the root HTML element created
font-family	string	font name	`Ubuntu, Helvetica, Arial, sans-serif`
font-size	`px`	font size	`13px`
line-height	`px` `%`	space between lines	`22px`
padding	`px` `%`	outer table padding, supports up to 4 parameters	`10px 25px`
padding-bottom	`px` `%`	bottom padding
padding-left	`px` `%`	left padding
padding-right	`px` `%`	right padding
padding-top	`px` `%`	top padding
role	`none` `presentation`	specify the role attribute
table-layout	`auto` `fixed` `initial` `inherit`	sets the table layout	`auto`
width	`px` `%` `auto`	table width	`100%`