Join Chris Converse for an in-depth discussion in this video Styling the table row for the callouts, part of Creating a Responsive HTML Email.
Next, we'll work on the row for the callouts.…Let's scroll down.…Let's find the second to last row here, the first td.…Let's open up from our snippets folder. The e-callout-row file.…At the top, let's come up and select the td tag.…Let's copy that.…Go back to our e-mail.html. Let's replace the first td,…in the second to last row with that td. So that return, at this base.…
Let's come back to our e call out row, that HTML file.…Inside here we have the markup for one of the promos.…So just like in the last movie, we're going to…take each individual callout and make them separate tables.…So, let's copy that entire call out one to the clipboard.…Switch back to our email.html. Let's paste that inside of the td.…I'm going to come up here and format that a little bit.…So now with that in place, we need to add three additional call outs.…Let's come back to our exercise files.…Let's open up f-callouts.html.…Inside of here, I have the callouts score numbers 2,3,4.…
So, lets come in here…and copy all 3 of these tables.…
This course was created and produced by Chris Converse. We are honored to host this content in our library.
- Creating the graphics
- Setting up the base layout structure
- Styling the table rows for the headline, banner, etc.
- Creating buttons
- Adding CSS media queries
- Styling the content
- Incorporating animation and web fonts
- Validating your code
- Testing in various email clients
Skill Level Beginner
Q: What are the sizes of the images used in this course?
Q: This course was updated on 11/26/2013. What changed?
A: We added two new movies to Chapter 5, "Adding HTML5 video into HTML email" and "Encoding and embedding base64 images."
Q: This course was updated on 12/03/2014. What changed?
A: We added one bonus movie, "Using high-definition graphics in your HTML email."