What's the best way to center your HTML email content in the browser window (or email client preview pane)?

html-email css-tables
Joel Glovier picture Joel Glovier · May 18, 2010 · Viewed 177.3k times · Source

I normally use CSS rules for margin:0 auto along with a 960 container for my standard browser based content, but I'm new to HTML email creation and I've got the following design that I'd like to now center in the browser window without standard CSS.

http://static.helpcurenow.org/mockups/emails/2010/may-survey/survey.html

I seem to recall seeing somewhere that it can also be accomplished by wrapping your email table design in an outer table set to width:100% and using some inline style for text-align:center on the tbody or something like this to do it?

Is there a best practice for this?

Answer

Shadi Almosri picture Shadi Almosri · May 18, 2010

Align the table to center.

<table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
        <td align="center">
            Your Content
        </td>
    </tr>
</table>

Where you have "your content" if it is a table, set it to the desired width and you will have centred content.

Related questions

Sending HTML email using Python

How can I send the HTML content in an email using Python? I can send simple text.

Read More
Color a table row with style="color:#fff" for displaying in an email

We would like to display order details as table in an email ​<table> <thead> <tr> <th>Header 1</th> <th>Header 2</th> <th>Header 3</…

Read More
HTML5 Email Input Pattern Attribute

I’m trying to make a html5 form that contains one email input, one check box input, and one submit input. I'm trying to use the pattern attribute for the email input but I don't know what to place in …

Read More