diff --git a/docs/examples/dist/RTL.html b/docs/examples/dist/RTL.html
index f3974f8b..48006fcf 100644
--- a/docs/examples/dist/RTL.html
+++ b/docs/examples/dist/RTL.html
@@ -20,16 +20,25 @@
         <style>
           html, body{ min-height:100%; scroll-behavior: smooth; }
           body{
-            font:14px Arial;
-            margin:0;
-            overflow-x:hidden;
+            font: 14px Arial;
+            margin: 0;
+            overflow-x: hidden;
+            height: 100vh;
+            display: grid;
+            place-items: center;
           }
 
-          tags + input, tags + textarea {
-            position: initial !important;
-            left: 0 !important;
+          .tagify {
+            min-width: 300px;
+            max-width: 500px;
+          }
+
+          .tagify + input, .tagify + textarea {
+            position: fixed !important;
+            bottom: 10px;
+            left: 10px !important;
+            right: 10px;
             transform: none !important;
-            width: 100%;
             padding: 6px;
             border: 2px solid #999;
             margin-bottom: 1em;
diff --git a/docs/examples/dist/advance-options.html b/docs/examples/dist/advance-options.html
index 71c59343..112adb35 100644
--- a/docs/examples/dist/advance-options.html
+++ b/docs/examples/dist/advance-options.html
@@ -20,16 +20,25 @@
         <style>
           html, body{ min-height:100%; scroll-behavior: smooth; }
           body{
-            font:14px Arial;
-            margin:0;
-            overflow-x:hidden;
+            font: 14px Arial;
+            margin: 0;
+            overflow-x: hidden;
+            height: 100vh;
+            display: grid;
+            place-items: center;
           }
 
-          tags + input, tags + textarea {
-            position: initial !important;
-            left: 0 !important;
+          .tagify {
+            min-width: 300px;
+            max-width: 500px;
+          }
+
+          .tagify + input, .tagify + textarea {
+            position: fixed !important;
+            bottom: 10px;
+            left: 10px !important;
+            right: 10px;
             transform: none !important;
-            width: 100%;
             padding: 6px;
             border: 2px solid #999;
             margin-bottom: 1em;
diff --git a/docs/examples/dist/basic.html b/docs/examples/dist/basic.html
index cbf59ff4..c1da07e4 100644
--- a/docs/examples/dist/basic.html
+++ b/docs/examples/dist/basic.html
@@ -20,16 +20,25 @@
         <style>
           html, body{ min-height:100%; scroll-behavior: smooth; }
           body{
-            font:14px Arial;
-            margin:0;
-            overflow-x:hidden;
+            font: 14px Arial;
+            margin: 0;
+            overflow-x: hidden;
+            height: 100vh;
+            display: grid;
+            place-items: center;
           }
 
-          tags + input, tags + textarea {
-            position: initial !important;
-            left: 0 !important;
+          .tagify {
+            min-width: 300px;
+            max-width: 500px;
+          }
+
+          .tagify + input, .tagify + textarea {
+            position: fixed !important;
+            bottom: 10px;
+            left: 10px !important;
+            right: 10px;
             transform: none !important;
-            width: 100%;
             padding: 6px;
             border: 2px solid #999;
             margin-bottom: 1em;
diff --git a/docs/examples/dist/different-look.html b/docs/examples/dist/different-look.html
index 80e12897..b37fa68d 100644
--- a/docs/examples/dist/different-look.html
+++ b/docs/examples/dist/different-look.html
@@ -20,16 +20,25 @@
         <style>
           html, body{ min-height:100%; scroll-behavior: smooth; }
           body{
-            font:14px Arial;
-            margin:0;
-            overflow-x:hidden;
+            font: 14px Arial;
+            margin: 0;
+            overflow-x: hidden;
+            height: 100vh;
+            display: grid;
+            place-items: center;
           }
 
-          tags + input, tags + textarea {
-            position: initial !important;
-            left: 0 !important;
+          .tagify {
+            min-width: 300px;
+            max-width: 500px;
+          }
+
+          .tagify + input, .tagify + textarea {
+            position: fixed !important;
+            bottom: 10px;
+            left: 10px !important;
+            right: 10px;
             transform: none !important;
-            width: 100%;
             padding: 6px;
             border: 2px solid #999;
             margin-bottom: 1em;
diff --git a/docs/examples/dist/disabled-user-input.html b/docs/examples/dist/disabled-user-input.html
index 87e94d7e..f02fadf8 100644
--- a/docs/examples/dist/disabled-user-input.html
+++ b/docs/examples/dist/disabled-user-input.html
@@ -20,16 +20,25 @@
         <style>
           html, body{ min-height:100%; scroll-behavior: smooth; }
           body{
-            font:14px Arial;
-            margin:0;
-            overflow-x:hidden;
+            font: 14px Arial;
+            margin: 0;
+            overflow-x: hidden;
+            height: 100vh;
+            display: grid;
+            place-items: center;
           }
 
-          tags + input, tags + textarea {
-            position: initial !important;
-            left: 0 !important;
+          .tagify {
+            min-width: 300px;
+            max-width: 500px;
+          }
+
+          .tagify + input, .tagify + textarea {
+            position: fixed !important;
+            bottom: 10px;
+            left: 10px !important;
+            right: 10px;
             transform: none !important;
-            width: 100%;
             padding: 6px;
             border: 2px solid #999;
             margin-bottom: 1em;
diff --git a/docs/examples/dist/disabled.html b/docs/examples/dist/disabled.html
index 09184e62..534c8e23 100644
--- a/docs/examples/dist/disabled.html
+++ b/docs/examples/dist/disabled.html
@@ -20,16 +20,25 @@
         <style>
           html, body{ min-height:100%; scroll-behavior: smooth; }
           body{
-            font:14px Arial;
-            margin:0;
-            overflow-x:hidden;
+            font: 14px Arial;
+            margin: 0;
+            overflow-x: hidden;
+            height: 100vh;
+            display: grid;
+            place-items: center;
           }
 
-          tags + input, tags + textarea {
-            position: initial !important;
-            left: 0 !important;
+          .tagify {
+            min-width: 300px;
+            max-width: 500px;
+          }
+
+          .tagify + input, .tagify + textarea {
+            position: fixed !important;
+            bottom: 10px;
+            left: 10px !important;
+            right: 10px;
             transform: none !important;
-            width: 100%;
             padding: 6px;
             border: 2px solid #999;
             margin-bottom: 1em;
diff --git a/docs/examples/dist/drag-sort.html b/docs/examples/dist/drag-sort.html
index 1985a5e1..0130fcfc 100644
--- a/docs/examples/dist/drag-sort.html
+++ b/docs/examples/dist/drag-sort.html
@@ -20,16 +20,25 @@
         <style>
           html, body{ min-height:100%; scroll-behavior: smooth; }
           body{
-            font:14px Arial;
-            margin:0;
-            overflow-x:hidden;
+            font: 14px Arial;
+            margin: 0;
+            overflow-x: hidden;
+            height: 100vh;
+            display: grid;
+            place-items: center;
           }
 
-          tags + input, tags + textarea {
-            position: initial !important;
-            left: 0 !important;
+          .tagify {
+            min-width: 300px;
+            max-width: 500px;
+          }
+
+          .tagify + input, .tagify + textarea {
+            position: fixed !important;
+            bottom: 10px;
+            left: 10px !important;
+            right: 10px;
             transform: none !important;
-            width: 100%;
             padding: 6px;
             border: 2px solid #999;
             margin-bottom: 1em;
diff --git a/docs/examples/dist/extra-properties.html b/docs/examples/dist/extra-properties.html
index 6e10939e..8d3acd3b 100644
--- a/docs/examples/dist/extra-properties.html
+++ b/docs/examples/dist/extra-properties.html
@@ -20,16 +20,25 @@
         <style>
           html, body{ min-height:100%; scroll-behavior: smooth; }
           body{
-            font:14px Arial;
-            margin:0;
-            overflow-x:hidden;
+            font: 14px Arial;
+            margin: 0;
+            overflow-x: hidden;
+            height: 100vh;
+            display: grid;
+            place-items: center;
           }
 
-          tags + input, tags + textarea {
-            position: initial !important;
-            left: 0 !important;
+          .tagify {
+            min-width: 300px;
+            max-width: 500px;
+          }
+
+          .tagify + input, .tagify + textarea {
+            position: fixed !important;
+            bottom: 10px;
+            left: 10px !important;
+            right: 10px;
             transform: none !important;
-            width: 100%;
             padding: 6px;
             border: 2px solid #999;
             margin-bottom: 1em;
diff --git a/docs/examples/dist/input-suggestions-styled-as-tags.html b/docs/examples/dist/input-suggestions-styled-as-tags.html
index 669b5037..55d926a5 100644
--- a/docs/examples/dist/input-suggestions-styled-as-tags.html
+++ b/docs/examples/dist/input-suggestions-styled-as-tags.html
@@ -20,16 +20,25 @@
         <style>
           html, body{ min-height:100%; scroll-behavior: smooth; }
           body{
-            font:14px Arial;
-            margin:0;
-            overflow-x:hidden;
+            font: 14px Arial;
+            margin: 0;
+            overflow-x: hidden;
+            height: 100vh;
+            display: grid;
+            place-items: center;
           }
 
-          tags + input, tags + textarea {
-            position: initial !important;
-            left: 0 !important;
+          .tagify {
+            min-width: 300px;
+            max-width: 500px;
+          }
+
+          .tagify + input, .tagify + textarea {
+            position: fixed !important;
+            bottom: 10px;
+            left: 10px !important;
+            right: 10px;
             transform: none !important;
-            width: 100%;
             padding: 6px;
             border: 2px solid #999;
             margin-bottom: 1em;
diff --git a/docs/examples/dist/input.html b/docs/examples/dist/input.html
index 4eab97bd..e2dc7930 100644
--- a/docs/examples/dist/input.html
+++ b/docs/examples/dist/input.html
@@ -20,16 +20,25 @@
         <style>
           html, body{ min-height:100%; scroll-behavior: smooth; }
           body{
-            font:14px Arial;
-            margin:0;
-            overflow-x:hidden;
+            font: 14px Arial;
+            margin: 0;
+            overflow-x: hidden;
+            height: 100vh;
+            display: grid;
+            place-items: center;
           }
 
-          tags + input, tags + textarea {
-            position: initial !important;
-            left: 0 !important;
+          .tagify {
+            min-width: 300px;
+            max-width: 500px;
+          }
+
+          .tagify + input, .tagify + textarea {
+            position: fixed !important;
+            bottom: 10px;
+            left: 10px !important;
+            right: 10px;
             transform: none !important;
-            width: 100%;
             padding: 6px;
             border: 2px solid #999;
             margin-bottom: 1em;
diff --git a/docs/examples/dist/manual-suggestions.html b/docs/examples/dist/manual-suggestions.html
index f2372bed..e7d34534 100644
--- a/docs/examples/dist/manual-suggestions.html
+++ b/docs/examples/dist/manual-suggestions.html
@@ -20,16 +20,25 @@
         <style>
           html, body{ min-height:100%; scroll-behavior: smooth; }
           body{
-            font:14px Arial;
-            margin:0;
-            overflow-x:hidden;
+            font: 14px Arial;
+            margin: 0;
+            overflow-x: hidden;
+            height: 100vh;
+            display: grid;
+            place-items: center;
           }
 
-          tags + input, tags + textarea {
-            position: initial !important;
-            left: 0 !important;
+          .tagify {
+            min-width: 300px;
+            max-width: 500px;
+          }
+
+          .tagify + input, .tagify + textarea {
+            position: fixed !important;
+            bottom: 10px;
+            left: 10px !important;
+            right: 10px;
             transform: none !important;
-            width: 100%;
             padding: 6px;
             border: 2px solid #999;
             margin-bottom: 1em;
diff --git a/docs/examples/dist/mix.html b/docs/examples/dist/mix.html
index b023bddb..ffe6728b 100644
--- a/docs/examples/dist/mix.html
+++ b/docs/examples/dist/mix.html
@@ -20,16 +20,25 @@
         <style>
           html, body{ min-height:100%; scroll-behavior: smooth; }
           body{
-            font:14px Arial;
-            margin:0;
-            overflow-x:hidden;
+            font: 14px Arial;
+            margin: 0;
+            overflow-x: hidden;
+            height: 100vh;
+            display: grid;
+            place-items: center;
           }
 
-          tags + input, tags + textarea {
-            position: initial !important;
-            left: 0 !important;
+          .tagify {
+            min-width: 300px;
+            max-width: 500px;
+          }
+
+          .tagify + input, .tagify + textarea {
+            position: fixed !important;
+            bottom: 10px;
+            left: 10px !important;
+            right: 10px;
             transform: none !important;
-            width: 100%;
             padding: 6px;
             border: 2px solid #999;
             margin-bottom: 1em;
diff --git a/docs/examples/dist/mode-select.html b/docs/examples/dist/mode-select.html
index a6087ba3..8bbcfd8c 100644
--- a/docs/examples/dist/mode-select.html
+++ b/docs/examples/dist/mode-select.html
@@ -20,16 +20,25 @@
         <style>
           html, body{ min-height:100%; scroll-behavior: smooth; }
           body{
-            font:14px Arial;
-            margin:0;
-            overflow-x:hidden;
+            font: 14px Arial;
+            margin: 0;
+            overflow-x: hidden;
+            height: 100vh;
+            display: grid;
+            place-items: center;
           }
 
-          tags + input, tags + textarea {
-            position: initial !important;
-            left: 0 !important;
+          .tagify {
+            min-width: 300px;
+            max-width: 500px;
+          }
+
+          .tagify + input, .tagify + textarea {
+            position: fixed !important;
+            bottom: 10px;
+            left: 10px !important;
+            right: 10px;
             transform: none !important;
-            width: 100%;
             padding: 6px;
             border: 2px solid #999;
             margin-bottom: 1em;
diff --git a/docs/examples/dist/outside-of-the-box.html b/docs/examples/dist/outside-of-the-box.html
index 1f724bec..1a74ee9a 100644
--- a/docs/examples/dist/outside-of-the-box.html
+++ b/docs/examples/dist/outside-of-the-box.html
@@ -20,16 +20,25 @@
         <style>
           html, body{ min-height:100%; scroll-behavior: smooth; }
           body{
-            font:14px Arial;
-            margin:0;
-            overflow-x:hidden;
+            font: 14px Arial;
+            margin: 0;
+            overflow-x: hidden;
+            height: 100vh;
+            display: grid;
+            place-items: center;
           }
 
-          tags + input, tags + textarea {
-            position: initial !important;
-            left: 0 !important;
+          .tagify {
+            min-width: 300px;
+            max-width: 500px;
+          }
+
+          .tagify + input, .tagify + textarea {
+            position: fixed !important;
+            bottom: 10px;
+            left: 10px !important;
+            right: 10px;
             transform: none !important;
-            width: 100%;
             padding: 6px;
             border: 2px solid #999;
             margin-bottom: 1em;
diff --git a/docs/examples/dist/readonly-mixed.html b/docs/examples/dist/readonly-mixed.html
index d1bf5086..0640acdd 100644
--- a/docs/examples/dist/readonly-mixed.html
+++ b/docs/examples/dist/readonly-mixed.html
@@ -20,16 +20,25 @@
         <style>
           html, body{ min-height:100%; scroll-behavior: smooth; }
           body{
-            font:14px Arial;
-            margin:0;
-            overflow-x:hidden;
+            font: 14px Arial;
+            margin: 0;
+            overflow-x: hidden;
+            height: 100vh;
+            display: grid;
+            place-items: center;
           }
 
-          tags + input, tags + textarea {
-            position: initial !important;
-            left: 0 !important;
+          .tagify {
+            min-width: 300px;
+            max-width: 500px;
+          }
+
+          .tagify + input, .tagify + textarea {
+            position: fixed !important;
+            bottom: 10px;
+            left: 10px !important;
+            right: 10px;
             transform: none !important;
-            width: 100%;
             padding: 6px;
             border: 2px solid #999;
             margin-bottom: 1em;
diff --git a/docs/examples/dist/readonly.html b/docs/examples/dist/readonly.html
index 3397da1b..bd7551f6 100644
--- a/docs/examples/dist/readonly.html
+++ b/docs/examples/dist/readonly.html
@@ -20,16 +20,25 @@
         <style>
           html, body{ min-height:100%; scroll-behavior: smooth; }
           body{
-            font:14px Arial;
-            margin:0;
-            overflow-x:hidden;
+            font: 14px Arial;
+            margin: 0;
+            overflow-x: hidden;
+            height: 100vh;
+            display: grid;
+            place-items: center;
           }
 
-          tags + input, tags + textarea {
-            position: initial !important;
-            left: 0 !important;
+          .tagify {
+            min-width: 300px;
+            max-width: 500px;
+          }
+
+          .tagify + input, .tagify + textarea {
+            position: fixed !important;
+            bottom: 10px;
+            left: 10px !important;
+            right: 10px;
             transform: none !important;
-            width: 100%;
             padding: 6px;
             border: 2px solid #999;
             margin-bottom: 1em;
diff --git a/docs/examples/dist/textarea.html b/docs/examples/dist/textarea.html
index 9e4ec8bb..b292d289 100644
--- a/docs/examples/dist/textarea.html
+++ b/docs/examples/dist/textarea.html
@@ -20,16 +20,25 @@
         <style>
           html, body{ min-height:100%; scroll-behavior: smooth; }
           body{
-            font:14px Arial;
-            margin:0;
-            overflow-x:hidden;
+            font: 14px Arial;
+            margin: 0;
+            overflow-x: hidden;
+            height: 100vh;
+            display: grid;
+            place-items: center;
           }
 
-          tags + input, tags + textarea {
-            position: initial !important;
-            left: 0 !important;
+          .tagify {
+            min-width: 300px;
+            max-width: 500px;
+          }
+
+          .tagify + input, .tagify + textarea {
+            position: fixed !important;
+            bottom: 10px;
+            left: 10px !important;
+            right: 10px;
             transform: none !important;
-            width: 100%;
             padding: 6px;
             border: 2px solid #999;
             margin-bottom: 1em;
diff --git a/docs/examples/dist/users-list.html b/docs/examples/dist/users-list.html
index a3894f88..fc082014 100644
--- a/docs/examples/dist/users-list.html
+++ b/docs/examples/dist/users-list.html
@@ -20,16 +20,25 @@
         <style>
           html, body{ min-height:100%; scroll-behavior: smooth; }
           body{
-            font:14px Arial;
-            margin:0;
-            overflow-x:hidden;
+            font: 14px Arial;
+            margin: 0;
+            overflow-x: hidden;
+            height: 100vh;
+            display: grid;
+            place-items: center;
           }
 
-          tags + input, tags + textarea {
-            position: initial !important;
-            left: 0 !important;
+          .tagify {
+            min-width: 300px;
+            max-width: 500px;
+          }
+
+          .tagify + input, .tagify + textarea {
+            position: fixed !important;
+            bottom: 10px;
+            left: 10px !important;
+            right: 10px;
             transform: none !important;
-            width: 100%;
             padding: 6px;
             border: 2px solid #999;
             margin-bottom: 1em;