53 lines
1.7 KiB
Markdown
53 lines
1.7 KiB
Markdown
# HTML Email Table Patterns
|
|
|
|
When sending structured/tabular data by email (fee schedules, pricing, comparisons, timelines):
|
|
|
|
## CRITICAL: Never regex-convert markdown tables
|
|
|
|
Email clients (Gmail, Outlook, Yahoo) strip `<style>` blocks and misrender complex markdown-to-HTML conversions. **Build tables by hand in Python string interpolation.**
|
|
|
|
## Correct pattern (hand-crafted HTML)
|
|
|
|
```python
|
|
rows = [
|
|
("Tier 1", "$3,300 (22%)", "$11,700", "2-14 days"),
|
|
("Tier 2", "$4,500 (30%)", "$10,500", "15-30 days"),
|
|
]
|
|
html = '<table cellpadding="6" cellspacing="0" border="0" style="font-size:13px;color:#333;">'
|
|
html += '<tr style="background:#f5f5f5;"><td style="border:1px solid #ddd;padding:6px 12px;"><b>Scenario</b></td>... </tr>'
|
|
for r in rows:
|
|
html += f'<tr><td style="border:1px solid #ddd;padding:6px 12px;">{r[0]}</td>...'
|
|
html += '</table>'
|
|
```
|
|
|
|
## Cell styling
|
|
|
|
| Attribute | Value |
|
|
|-----------|-------|
|
|
| `cellpadding` | `"6"` |
|
|
| `cellspacing` | `"0"` |
|
|
| `border` | `"0"` |
|
|
| Individual cell style | `border:1px solid #ddd;padding:6px 12px;` |
|
|
| Header row | `<tr style="background:#f5f5f5;">` |
|
|
| Merged cells | `rowspan="2"` with `vertical-align:middle` |
|
|
|
|
## Multi-part message construction
|
|
|
|
```python
|
|
msg = MIMEMultipart('alternative')
|
|
plain = MIMEText(markdown_text, 'plain')
|
|
html_part = MIMEText(full_html_doc, 'html')
|
|
msg.attach(plain) # plain text first
|
|
msg.attach(html_part) # HTML second (client picks last understood)
|
|
```
|
|
|
|
## Common failure: misplaced closing quote
|
|
|
|
The Sho'Nuff closing quote goes between the last body paragraph and the signature `<hr>` divider, NOT inside the signature table block. Pattern:
|
|
|
|
```python
|
|
full_html = body_content + f'<p><em>{closing}</em></p>' + sig_html
|
|
```
|
|
|
|
Not `body_content + sig_html_with_quote_buried_inside`.
|