"Email Template 2"
Bootstrap 3.3.0 Snippet by MTaqi

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<body style="padding:0;margin:0;">
<table width="100%" bgcolor="#dddddd" height="100%" width="100%">
<tr><td align="center" valign="top">
<table width="600" bgcolor="#ffffff" id="content" style="border:solid 1px #ccc;" cellpadding="0" cellspacing="10">
<tr>
<td height="150">
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td id="header" align="left" valign="middle">
<table id="header-logo" width="200" cellpadding="0" cellspacing="0" border="0" align="right">
<tr>
<td width="200">
<img src="http://imga.nxjimg.com/emp_image/company_logos/ownerrewards_off.gif" />
</td>
</tr>
</table>
<table id="header-text" width="375" cellpadding="0" cellspacing="0" border="0" align="right">
<tr>
<td style="font-size: 24px; font-family: Helvetica, Arial, sans-serif;">
Joseph,
</td>
</tr>
<tr>
<td id="header-text-intro" style="font-family:Helvetica, Arial, sans-serif; font-size:13px;">
Here are some of this week's top offers. These offers are available to you as an exclusive member benefit.
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
@media only screen and (max-width: 600px){
#content {
width: 100%;
}
#header-logo{
text-align: center;
width:100%;
}
#header-text{
width:100%;
}
#intro-text-intro{
padding:.5em;
}
.offer-image{ width: 75px; height:auto; }
table.offer-image{ float:left; }
table.offer-text{ float:left; }
.offer-text{ width: auto;}
.offer-text td{ padding-left: 12px;}
.shopnow{ width:100%; min-width:325px; border-radius: 5px;font-size:18px;font-weight: bold;}
.offer{ background: #f8f8f8; border: solid 1px #ddd;}
#offers{ border-spacing:10px }
}
@media only screen and (max-width: 475px){
table.offer-image{ float:right;margin-bottom: -75px;}
/*table.offer-text{ background: #f8f8f8;}*/
.offer-text td{ padding: 0 10px;}
.shopnow{ width:100%; min-width:auto; border-radius: 5px;}
}
@media only screen and (max-width: 350px){
/*table.offer-image{ display:none; }*/
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More


Questions / Comments: