Skip to content

Instantly share code, notes, and snippets.

Responsive Mail UI ('-' * 18) Credit for design goes to Vivek Venkatraman: http://dribbble.com/shots/1455744-Email-Concept/

Check it out in full view to see it's responsiveness. It's responsive until pretty darn small but i haven't actually tested it on mobile devices. Tested in IE9+, latest Chrome and Firefox.

I've noticed the message (slide-in section) is some times visible on page load. If that's the case just reload the page, that's a browser bug.

A Pen by Nicklas Sandell on CodePen.

<!DOCTYPE html>
<html>
<head>
<title></title>
<!-- Android
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
<meta charset="utf-8">-->
<!-- iPad/iPhone specific css below, add after your main css >