From 0562206bcea4cfe21362cbe288cdb3adab5ddf29 Mon Sep 17 00:00:00 2001
From: Pavel Reznikov <pashka.reznikov@gmail.com>
Date: Mon, 17 Nov 2014 00:15:14 -0800
Subject: [PATCH] base usage section

---
 README.md | 23 +++++++++++++++++++++++
 1 file changed, 23 insertions(+)

diff --git a/README.md b/README.md
index 765b9c8..1976199 100644
--- a/README.md
+++ b/README.md
@@ -24,6 +24,25 @@ Usage
 
 Coming soon...
 
+## Basic usage
+
+```html
+    <div class="grid-stack">
+        <div class="grid-stack-item" data-gs-x="0" data-gs-y="0" data-gs-width="4" data-gs-height="2"><div class="grid-stack-item-content"></div></div>
+        <div class="grid-stack-item" data-gs-x="4" data-gs-y="0" data-gs-width="4" data-gs-height="4"><div class="grid-stack-item-content"></div></div>
+    </div>
+    
+    <script type="text/javascript">
+    $(function () {
+        var options = {
+            cell_height: 80,
+            vertical_margin: 10
+        };
+        $('.grid-stack).gridstack(options);
+    });
+    </script>
+```
+
 ## Options
 
 - `width` - amount of columns (default: 12)
@@ -35,6 +54,10 @@ Coming soon...
 - `auto` - if `false` it tells to do not initialize existing items (default: true)
 - `min_width` - minimal width. If window width is less grid will be shown in one-column mode (default: 768)
 
+## Grid attributes
+
+ - `data-gs-width` - grid width
+
 ## Item attributes
 
 - `data-gs-x`, `data-gs-y` - element position