Alas and alack, MS Outlook 2016 continues the trend of of being awful at rendering CSS and HTML for emails. Here are some great tips for coding to (or around) 2016's particular set of rendering bugs
Anyone who has had the "pleasure" of designing email has probably come to one very poignant conclusion: MS Outlook is terrible at rendering CSS and HTML for emails. The reason for this is that, starting with Outlook 2007, Microsoft thought it would be a reall great idea to stop rendering HTML email with the Internet Explorer engine, and instead render it with the MS Word rendering engine. Yes, you read that correctly: Word handles HTML and CSS for any emails in Outlook.
Came across this great cheat sheet listing many of the special HTML characters (or glyphs) we, as web developers, come across from time to time. In addition to listing the the HTML code, the chart also lists the numeric code; a description of the character; the HEX code; the ISO in CSS content (for use with pseudo-selectors like :before and :after); and the Octal (I'll be honest, I've never had to use this one before). All in all, a super-handy reference sheet to have around.
I ran into a task today that led me to wonder about the best approach to create and implement CSS background images for hi-resolution displays like those found on more and more mobile phones and tablets. Hi-res displays, like those phone on the iPhone, iPad, Kindle HD, and the latest Motorola Droid and Samsung Galaxy phones, are capable of rendering stunning, sharp images—but only if you supply them through your Website or app.
It has become increasingly important to make sure your layout doesn't break when viewing your Website on a phone. So what do you do when, in Android or Google Chrome, you notice that your layout is blowing out because of an especially long word (or line of unbroken text, like a URL)?
Have you ever tried to print a web page from your browser and found some crucial piece of content is being cut in half at the page break? There's a very easy way to fix this using CSS for print.
I started working on a site recently using the Omega theme. In general, I find (once you get used to its ins and outs) Omega is a great theme to get a responsive Drupal 7 site off the ground relatively quickly. It comes packaged with all sorts of goodies, and is based (and includes) the 960 Grid System.