Skip to content

Instantly share code, notes, and snippets.

@jamesmacwhite
Last active April 27, 2016 07:51
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jamesmacwhite/94f48bbd112134f345e8649dfa3f4017 to your computer and use it in GitHub Desktop.
Save jamesmacwhite/94f48bbd112134f345e8649dfa3f4017 to your computer and use it in GitHub Desktop.
Floated table columns with dotmailer Easy Editor
<!DOCTYPE html>
<html>
<head>
<title>dotmailer Easy Editor floated table three column layout</title>
</head>
<body>
<!-- QUEUE DEVELOPER NOTES! -->
<h1>Floated table three column layout</h1>
<p>A way to create a three column layout with with floated tables that is compatible with the dotmailer Easy Editor.</p>
<p>Example width sizes used are for guidance only. Tweak as needed!</p>
<p><em>If you cheated and used table cell stacking, you lose!</em></p>
<!-- The outer wrapper table would likely be the first <table> element in your template -->
<!-- OUTER WRAPPER TABLE -->
<table border="0" cellpadding="0" cellspacing="0" width="600" style="width:600px; table-layout: auto;">
<tbody>
<tr>
<!-- OUTER DROPZONE -->
<td class="ee_dropzone" align="left" valign="top">
<!-- INNER WRAPPER TABLE -->
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="position: relative; table-layout: auto;" class="ee_columns ee_element" data-eewidth="600" ee-type="container" data-title="3 Columns" data-edit="3 Columns">
<tbody>
<tr>
<!-- INNER DROPZONE -->
<td align="left" valign="top" class="dropzone ved-scaled-cols">
<!-- COLUMN #1 START -->
<table border="0" cellpadding="0" cellspacing="0" align="left" width="200" style="width: 200px; table-layout: auto;" class="ee_column ee_element" ee-type="element" data-eewidth="600">
<tbody>
<tr>
<!-- INNER COLUMN DROPZONE -->
<td align="left" valign="top" class="ee_dropzone">
<!-- INNER COLUMN TABLE -->
<table cellpadding="0" cellspacing="0" width="100%" class="ee_element" style="table-layout:auto;">
<tbody>
<tr>
<td align="left" valign="top" class="ee_dropzone">
<!-- THE LZ IS HOT! DROP STUFF HERE -->
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<!-- COLUMN #1 END -->
<!--[if mso]></td><td><![endif]-->
<!-- COLUMN #2 START -->
<table border="0" cellpadding="0" cellspacing="0" align="left" width="200" style="width: 200px; table-layout: auto;" class="ee_column ee_element" data-eewidth="600" ee-type="element">
<tbody>
<tr>
<!-- INNER COLUMN DROPZONE -->
<td align="left" valign="top" class="ee_dropzone">
<!-- INNER COLUMN TABLE -->
<table cellpadding="0" cellspacing="0" width="100%" class="ee_element" style="table-layout:auto;">
<tbody>
<tr>
<td align="left" valign="top" class="ee_dropzone">
<!-- THE LZ IS HOT! DROP STUFF HERE -->
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<!-- COLUMN #2 END -->
<!--[if mso]></td><td><![endif]-->
<!-- COLUMN #3 START -->
<table border="0" cellpadding="0" cellspacing="0" align="left" width="200" style="width: 200px; table-layout: auto;" class="ee_column ee_element" data-eewidth="600" ee-type="element">
<tbody>
<tr>
<!-- INNER COLUMN DROPZONE -->
<td align="left" valign="top" class="ee_dropzone">
<!-- INNER COLUMN TABLE -->
<table cellpadding="0" cellspacing="0" width="100%" class="ee_element" style="table-layout:auto;">
<tbody>
<tr>
<td align="left" valign="top" class="ee_dropzone">
<!-- THE LZ IS HOT! DROP STUFF HERE -->
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<!-- COLUMN #3 END -->
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment