diff --git a/dist/cytoscape-actionbar.js b/dist/cytoscape-actionbar.js
index f70052b..7559edb 100644
--- a/dist/cytoscape-actionbar.js
+++ b/dist/cytoscape-actionbar.js
@@ -1,14 +1,17 @@
 angular.module('cytoscape.actionbar', []).directive('cytoscapeActionbar', ["$timeout", function($timeout) {
   return {
-    template: "<div class=\"cytoscape-graph-actionbar\" style=\"right: 0; left: 0; position: absolute; z-index: 1000\">\n  <div ng-repeat=\"group in options.itemGroups\" ng-class=\"group.itemGroupClass\">\n      <button ng-repeat=\"item in group.items\" ng-click='item.action(cy, item)'\n        ng-disabled='!item.enabled()' ng-if='item.visible()'\n        ng-class='[options.actionItemClass, icon, item.icon]' data-container='body' bs-tooltip='item.tooltip'>\n      </button>\n  </div>\n</div>",
+    template: "<div class=\"cytoscape-graph-actionbar\" style=\"right: 1.5%; left: 1.5%; position: absolute; z-index: 1000\">\n  <div ng-repeat=\"group in options.itemGroups\" ng-class=\"group.itemsClass\">\n      <button ng-repeat=\"item in group.items\" ng-click='item.action(cy, item)'\n        ng-disabled='!item.enabled()' ng-if='item.visible()'\n        ng-class='[options.actionItemClass, icon, item.icon]' data-container='body' bs-tooltip='item.tooltip'>\n      </button>\n  </div>\n</div>",
     link: function(scope) {
       return cytoscape('core', 'actionbar', function(options) {
         var defaults, digestEvent, digestTimeout, group, i, item, j, k, len, len1, len2, ref, ref1, ref2, runDigestAfterEvent;
         defaults = {
-          itemGroups: [],
+          itemGroups: {},
           actionItemClass: 'action-item'
         };
         angular.extend(defaults, options);
+        if (options.itemGroups.itemsClass) {
+          options.itemGroups = [options.itemGroups];
+        }
         ref = options.itemGroups;
         for (i = 0, len = ref.length; i < len; i++) {
           group = ref[i];
diff --git a/dist/cytoscape-actionbar.min.js b/dist/cytoscape-actionbar.min.js
index 848edae..29d95ff 100644
--- a/dist/cytoscape-actionbar.min.js
+++ b/dist/cytoscape-actionbar.min.js
@@ -1 +1 @@
-angular.module("cytoscape.actionbar",[]).directive("cytoscapeActionbar",["$timeout",function(n){return{template:"<div class=\"cytoscape-graph-actionbar\" style=\"right: 0; left: 0; position: absolute; z-index: 1000\">\n  <div ng-repeat=\"group in options.itemGroups\" ng-class=\"group.itemGroupClass\">\n      <button ng-repeat=\"item in group.items\" ng-click='item.action(cy, item)'\n        ng-disabled='!item.enabled()' ng-if='item.visible()'\n        ng-class='[options.actionItemClass, icon, item.icon]' data-container='body' bs-tooltip='item.tooltip'>\n      </button>\n  </div>\n</div>",link:function(t){return cytoscape("core","actionbar",function(i){var e,o,a,r,c,l,s,u,p,m,g,b,d,f,v;for(e={itemGroups:[],actionItemClass:"action-item"},angular.extend(e,i),b=i.itemGroups,c=0,p=b.length;p>c;c++)for(r=b[c],d=r.items,s=0,m=d.length;m>s;s++)l=d[s],null==l.visible&&(l.visible=function(){return!0}),null==l.enabled&&(l.enabled=function(){return!0});for(a=null,v=function(){return a&&n.cancel(a),a=n(function(){return a=null},100)},f=["zoom","pan"],u=0,g=f.length;g>u;u++)o=f[u],this.on(o,v);return t.options=i})}}}]);
\ No newline at end of file
+angular.module("cytoscape.actionbar",[]).directive("cytoscapeActionbar",["$timeout",function(t){return{template:"<div class=\"cytoscape-graph-actionbar\" style=\"right: 1.5%; left: 1.5%; position: absolute; z-index: 1000\">\n  <div ng-repeat=\"group in options.itemGroups\" ng-class=\"group.itemsClass\">\n      <button ng-repeat=\"item in group.items\" ng-click='item.action(cy, item)'\n        ng-disabled='!item.enabled()' ng-if='item.visible()'\n        ng-class='[options.actionItemClass, icon, item.icon]' data-container='body' bs-tooltip='item.tooltip'>\n      </button>\n  </div>\n</div>",link:function(n){return cytoscape("core","actionbar",function(i){var e,o,a,r,s,l,c,u,m,p,g,b,d,f,v;for(e={itemGroups:{},actionItemClass:"action-item"},angular.extend(e,i),i.itemGroups.itemsClass&&(i.itemGroups=[i.itemGroups]),b=i.itemGroups,s=0,m=b.length;m>s;s++)for(r=b[s],d=r.items,c=0,p=d.length;p>c;c++)l=d[c],null==l.visible&&(l.visible=function(){return!0}),null==l.enabled&&(l.enabled=function(){return!0});for(a=null,v=function(){return a&&t.cancel(a),a=t(function(){return a=null},100)},f=["zoom","pan"],u=0,g=f.length;g>u;u++)o=f[u],this.on(o,v);return n.options=i})}}}]);
\ No newline at end of file
diff --git a/src/CytoscapeActionbar.coffee b/src/CytoscapeActionbar.coffee
index 1725a65..8773210 100644
--- a/src/CytoscapeActionbar.coffee
+++ b/src/CytoscapeActionbar.coffee
@@ -1,7 +1,7 @@
 angular.module('cytoscape.actionbar', []).directive 'cytoscapeActionbar', ($timeout) ->
   template: """
-    <div class="cytoscape-graph-actionbar" style="right: 0; left: 0; position: absolute; z-index: 1000">
-      <div ng-repeat="group in options.itemGroups" ng-class="group.itemGroupClass">
+    <div class="cytoscape-graph-actionbar" style="right: 1.5%; left: 1.5%; position: absolute; z-index: 1000">
+      <div ng-repeat="group in options.itemGroups" ng-class="group.itemsClass">
           <button ng-repeat="item in group.items" ng-click='item.action(cy, item)'
             ng-disabled='!item.enabled()' ng-if='item.visible()'
             ng-class='[options.actionItemClass, icon, item.icon]' data-container='body' bs-tooltip='item.tooltip'>
@@ -15,10 +15,13 @@ angular.module('cytoscape.actionbar', []).directive 'cytoscapeActionbar', ($time
       'actionbar',
       (options) ->
         defaults =
-          itemGroups: []
+          itemGroups: {}
           actionItemClass: 'action-item' # set a class name for a toolbar item to help with styling
         angular.extend(defaults, options)
 
+        if options.itemGroups.itemsClass
+          options.itemGroups = [options.itemGroups]
+
         for group in options.itemGroups
           for item in group.items
             item.visible ?= -> true