From 7225aadb00385e77f9e85b272e364dccfba8bd15 Mon Sep 17 00:00:00 2001
From: Felipe da Silva <silvacontatoweb@gmail.com>
Date: Fri, 23 Mar 2018 11:45:46 -0300
Subject: [PATCH] new: snippet quotes

---
 quotes.md | 43 +++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 43 insertions(+)
 create mode 100644 quotes.md

diff --git a/quotes.md b/quotes.md
new file mode 100644
index 000000000..46a5490e5
--- /dev/null
+++ b/quotes.md
@@ -0,0 +1,43 @@
+### Quotes
+
+With more sophisticated CSS you can greatly enhance your website’s typography, an aspect that lots of people overlook. For instance, did you know that the quotation marks you are writing in your code are actually “primes” which are used for measurements and coordinates? When using “q” tags in HTML for quotations, you can automatically insert proper quotation marks (so-called smart quotes) before and after the quotation.
+
+#### HTML
+
+```html
+<q> CSS is awesome! </q>
+```
+
+#### CSS
+
+```css
+q {
+    quotes: "“" "”";
+}
+```
+
+#### Demo
+
+<div class="snippet-demo">
+  <div class="snippet-demo__sinppet-quotes">
+    <q> CSS is amazing! </q>
+  </div>
+</div>
+
+<style>
+q {
+  quotes: "“" "”";
+}
+</style>
+
+#### Explanation
+
+1. `quotes: "“" "”";` quotes CSS property indicates how user agents should render quotation marks.
+
+#### Browser support
+
+<span class="snippet__support-note">94.5%<</span>
+
+* http://smartquotesforsmartpeople.com/
+
+<!-- tags: animation -->