CMS Development

GWalsh
Contributor

Building Email Table - need advice

I'm trying to build a table for email purposes and am looking to adjust the border color of the table.  What tags would I need to add to do this? 

0 Upvotes
webdew
Guide | Diamond Partner
Guide | Diamond Partner

Building Email Table - need advice

Hi @GWalsh ,

To collapse the border use table {
border-collapse:collapse !important;
}
or to use for specific row give id="#headerTable" to that row and give style #headerTable {
border-collapse: separate !important;
}


Hope this helps!

If we were able to answer your query, kindly help the community by marking it as a solution.
Thanks and Regards. 

0 Upvotes
GWalsh
Contributor

Building Email Table - need advice

Thank you so much Anton! For a table with no border, but an underlined header, would the best way to do that be 

<TABLE BORDER="bottom" bordercolor="#ff0000" style="border:1px bottom #ff0000" >

0 Upvotes
Anton
Key Advisor | Diamond Partner
Key Advisor | Diamond Partner

Building Email Table - need advice

Hi @GWalsh

 

I would recommend to do it like this:

 

<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tbody>
    <tr>
      <th scope="col" style="border-bottom:1px solid #ff0000">header 1</th>
      <th scope="col" style="border-bottom:1px solid #ff0000">header 2</th>
      <th scope="col" style="border-bottom:1px solid #ff0000">header 3</th>
    </tr>
    <tr>
      <td>Cell 1</td>
      <td>Cell 2</td>
      <td>Cell 3</td>
    </tr>
    <tr>
      <td>Cell 1</td>
      <td>Cell 2</td>
      <td>Cell 3</td>
    </tr>
  </tbody>
</table>

 

best, 

Anton




check
Did my post help answer your query? Help the Community by marking it as a solution



0 Upvotes
GWalsh
Contributor

Building Email Table - need advice

Is there a way to collapse the border of the header, so it appears as a single line? The cell padding is currently set to 12 to properly space the table. Thanks!

0 Upvotes
GWalsh
Contributor

Building Email Table - need advice

Thank you Anton! And to specifically align some cells, would that be: 
<TR>
<TD>Content</TD>
<TD> align - center
Content

</TD>

</TR>

0 Upvotes
Anton
Key Advisor | Diamond Partner
Key Advisor | Diamond Partner

Building Email Table - need advice

this will do it's job:

...
<tr>
<td align="center" style="text-align:center"> {# if you want to align it verticaly centered add 'valign="middle"' without the single-quotes to it #}
Your Content
</td>
</tr>
...

 

best, 

Anton




check
Did my post help answer your query? Help the Community by marking it as a solution



0 Upvotes
Anton
Key Advisor | Diamond Partner
Key Advisor | Diamond Partner

Building Email Table - need advice

Hi @GWalsh

 

for best possible email client support I would suggest to do it like this for specific table cells:

<table>
...
<tr>
<td border="1" bordercolor="#ff0000" style="border: 1px solid #ff0000;....">
Your Content
</td>
</tr>
...
</table>

 

and like this for the whole table:

<table border="1" bordercolor="#ff0000" style="border:1px solid #ff0000">
...
<tr>
<td>
Your Content
</td>
</tr>
...
</table>

 

 

best, 

Anton




check
Did my post help answer your query? Help the Community by marking it as a solution



0 Upvotes