diff --git a/gulpfile.js b/gulpfile.js
index 1bf2173..6827e79 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -132,7 +132,9 @@ gulp.task('bundle-css', ['mkdir'], function () {
     'src/css/menu.css',
     'src/css/searchbox.css',
     'src/css/autocomplete.css',
-    'src/css/treepath.css'
+    'src/css/treepath.css',
+    'src/css/statusbar.css',
+    'src/css/navigationbar.css'
   ])
       .pipe(concatCss(NAME + '.css'))
       .pipe(gulp.dest(DIST))
diff --git a/src/css/jsoneditor.css b/src/css/jsoneditor.css
index 1e6900b..ad57f07 100644
--- a/src/css/jsoneditor.css
+++ b/src/css/jsoneditor.css
@@ -210,11 +210,16 @@ div.jsoneditor-outer {
   box-sizing: border-box;
 }
 
-div.jsoneditor-menu2 + div.jsoneditor-outer {
+div.jsoneditor-outer.has-nav-bar {
   margin: -61px 0 0 0;
   padding: 61px 0 0 0;
 }
 
+div.jsoneditor-outer.has-status-bar {
+  margin: -35px 0 -16px 0;
+  padding: 35px 0 16px 0;
+}
+
 textarea.jsoneditor-text,
 .ace-jsoneditor {
   min-height: 150px;
diff --git a/src/css/menu.css b/src/css/menu.css
index f6d3ef8..6a4f44c 100644
--- a/src/css/menu.css
+++ b/src/css/menu.css
@@ -89,28 +89,6 @@ div.jsoneditor-menu > div.jsoneditor-modes > button.jsoneditor-separator {
   margin-left: 10px;
 }
 
-div.jsoneditor-menu > div.jsoneditor-curserinfo {
-  line-height: 30px;
-}
-
-div.jsoneditor-menu > div.jsoneditor-curserinfo > .jsoneditor-curserinfo-label {
-  margin: 0 2px 0 4px;
-}
-
-div.jsoneditor-menu > div.jsoneditor-curserinfo > .jsoneditor-curserinfo-val {
-  margin-right: 4px;
-}
-
-div.jsoneditor-menu > div.jsoneditor-curserinfo > .jsoneditor-curserinfo-count {
-  margin-left: 4px;
-}
-
-div.jsoneditor-menu > div.jsoneditor-curserinfo > span {
-  color: white;
-  opacity: 0.8;
-  font-size: 10pt;
-}
-
 div.jsoneditor-menu a {
   font-family: arial, sans-serif;
   font-size: 10pt;
@@ -130,27 +108,3 @@ div.jsoneditor-menu a.jsoneditor-poweredBy {
   top: 0;
   padding: 10px;
 }
-
-div.jsoneditor-menu2 {
-  width: 100%;
-  height: 26px;
-  padding: 2px;
-  margin: 0;
-  -moz-box-sizing: border-box;
-  -webkit-box-sizing: border-box;
-  box-sizing: border-box;
-  color: #1A1A1A;
-  background-color: #e6e6e6;
-  border-bottom: 1px solid #3883fa;
-}
-
-div.jsoneditor-menu2:before {
-  content: '';
-  width: 100%;
-  height: 1px;
-  background-color: white;
-  opacity: 0.8;
-  position: absolute;
-  left: 0;
-  margin-top: -3px;
-}
\ No newline at end of file
diff --git a/src/css/navigationbar.css b/src/css/navigationbar.css
new file mode 100644
index 0000000..aa06fc7
--- /dev/null
+++ b/src/css/navigationbar.css
@@ -0,0 +1,31 @@
+div.jsoneditor-navigation-bar {
+  width: 100%;
+  height: 26px;
+  padding: 2px;
+  margin: 0;
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+  color: #1A1A1A;
+  background-color: #e6e6e6;
+  border-bottom: 1px solid #3883fa;
+}
+
+div.jsoneditor-navigation-bar:before {
+  content: '';
+  width: 100%;
+  height: 1px;
+  background-color: white;
+  opacity: 0.8;
+  position: absolute;
+  left: 0;
+  margin-top: -3px;
+}
+
+div.jsoneditor-navigation-bar.nav-bar-empty:after {
+  content: 'Select a node ...';
+  color: rgba(104, 104, 91, 0.56);
+  position: absolute;
+  margin-left: 6px;
+  margin-top: -1px;
+}
\ No newline at end of file
diff --git a/src/css/statusbar.css b/src/css/statusbar.css
new file mode 100644
index 0000000..9985474
--- /dev/null
+++ b/src/css/statusbar.css
@@ -0,0 +1,34 @@
+div.jsoneditor-statusbar {
+  line-height: 16px;
+  height: 17px;
+  color: #1A1A1A;
+  background-color: #e6e6e6;
+  margin-top: -17px;
+}
+
+div.jsoneditor-statusbar:before {
+  content: '';
+  width: 100%;
+  height: 1px;
+  background-color: #3883fa;  
+  position: absolute;
+  left: 0;
+  margin-top: 1px;
+  z-index: 999;
+}
+
+div.jsoneditor-statusbar > .jsoneditor-curserinfo-label {
+  margin: 0 2px 0 4px;
+}
+
+div.jsoneditor-statusbar > .jsoneditor-curserinfo-val {
+  margin-right: 4px;
+}
+
+div.jsoneditor-statusbar > .jsoneditor-curserinfo-count {
+  margin-left: 4px;
+}
+
+div.jsoneditor-statusbar > span {
+  font-size: 12px;
+}
\ No newline at end of file
diff --git a/src/js/JSONEditor.js b/src/js/JSONEditor.js
index 99270e4..8e5b6be 100644
--- a/src/js/JSONEditor.js
+++ b/src/js/JSONEditor.js
@@ -82,7 +82,8 @@ function JSONEditor (container, options, json) {
         'ajv', 'schema', 'schemaRefs','templates',
         'ace', 'theme','autocomplete',
         'onChange', 'onEditable', 'onError', 'onModeChange',
-        'escapeUnicode', 'history', 'search', 'mode', 'modes', 'name', 'indentation', 'sortObjectKeys', 'navigationBar'
+        'escapeUnicode', 'history', 'search', 'mode', 'modes', 'name', 'indentation', 
+        'sortObjectKeys', 'navigationBar', 'statusBar'
       ];
 
       Object.keys(options).forEach(function (option) {
diff --git a/src/js/textmode.js b/src/js/textmode.js
index f3aa22b..1d6fa21 100644
--- a/src/js/textmode.js
+++ b/src/js/textmode.js
@@ -36,6 +36,11 @@ var DEFAULT_THEME = 'ace/theme/jsoneditor';
 textmode.create = function (container, options) {
   // read options
   options = options || {};
+  
+  if(typeof options.statusBar === 'undefined') {
+    options.statusBar = true;
+  }
+
   this.options = options;
 
   // indentation
@@ -77,7 +82,6 @@ textmode.create = function (container, options) {
   this.aceEditor = undefined;  // ace code editor
   this.textarea = undefined;  // plain text editor (fallback when Ace is not available)
   this.validateSchema = null;
-  this.curserInfoElements = {};
 
   // create a debounced validate function
   this._debouncedValidate = util.debounce(this.validate.bind(this), this.DEBOUNCE_INTERVAL);
@@ -141,11 +145,6 @@ textmode.create = function (container, options) {
     });
   }
 
-  // create curser and count info
-  var curserAndCountInfo = document.createElement('div');
-  curserAndCountInfo.className = 'jsoneditor-curserinfo';
-  this.menu.appendChild(curserAndCountInfo);
-
   var emptyNode = {};
   var isReadOnly = (this.options.onEditable
   && typeof(this.options.onEditable === 'function')
@@ -191,31 +190,6 @@ textmode.create = function (container, options) {
       });
     }
 
-    var lnLabel = document.createElement('span');
-    lnLabel.className = 'jsoneditor-curserinfo-label';
-    lnLabel.innerText = 'Ln:';
-
-    var lnVal = document.createElement('span');
-    lnVal.className = 'jsoneditor-curserinfo-val';
-    lnVal.innerText = 0;
-
-    curserAndCountInfo.appendChild(lnLabel);
-    curserAndCountInfo.appendChild(lnVal);
-
-    var colLabel = document.createElement('span');
-    colLabel.className = 'jsoneditor-curserinfo-label';
-    colLabel.innerText = 'Col:';
-
-    var colVal = document.createElement('span');
-    colVal.className = 'jsoneditor-curserinfo-val';
-    colVal.innerText = 0;
-
-    curserAndCountInfo.appendChild(colLabel);
-    curserAndCountInfo.appendChild(colVal);
-
-    this.curserInfoElements.colVal = colVal;
-    this.curserInfoElements.lnVal = lnVal;
-
     var poweredBy = document.createElement('a');
     poweredBy.appendChild(document.createTextNode('powered by ace'));
     poweredBy.href = 'http://ace.ajax.org';
@@ -256,23 +230,60 @@ textmode.create = function (container, options) {
     textarea.onblur = this._onBlur.bind(this);
   }
 
-  var countLabel = document.createElement('span');
-  countLabel.className = 'jsoneditor-curserinfo-label';
-  countLabel.innerText = 'selected';
-  countLabel.style.display = 'none';
+  if (options.statusBar) {
+      
+      util.addClassName(this.content, 'has-status-bar');
 
-  var countVal = document.createElement('span');
-  countVal.className = 'jsoneditor-curserinfo-count';
-  countVal.innerText = 0;
-  countVal.style.display = 'none';
+      this.curserInfoElements = {};      
+      var statusBar = document.createElement('div');
+      statusBar.className = 'jsoneditor-statusbar';
+      this.frame.appendChild(statusBar);
 
-  this.curserInfoElements.countLabel = countLabel;
-  this.curserInfoElements.countVal = countVal;
+      if (this.mode == 'code') {
+        var lnLabel = document.createElement('span');
+        lnLabel.className = 'jsoneditor-curserinfo-label';
+        lnLabel.innerText = 'Ln:';
+  
+        var lnVal = document.createElement('span');
+        lnVal.className = 'jsoneditor-curserinfo-val';
+        lnVal.innerText = 0;
+  
+        statusBar.appendChild(lnLabel);
+        statusBar.appendChild(lnVal);
+  
+        var colLabel = document.createElement('span');
+        colLabel.className = 'jsoneditor-curserinfo-label';
+        colLabel.innerText = 'Col:';
+  
+        var colVal = document.createElement('span');
+        colVal.className = 'jsoneditor-curserinfo-val';
+        colVal.innerText = 0;
+  
+        statusBar.appendChild(colLabel);
+        statusBar.appendChild(colVal);
+  
+        this.curserInfoElements.colVal = colVal;
+        this.curserInfoElements.lnVal = lnVal;
+      } 
+    
+      var countLabel = document.createElement('span');
+      countLabel.className = 'jsoneditor-curserinfo-label';
+      countLabel.innerText = 'selected';
+      countLabel.style.display = 'none';
 
-  curserAndCountInfo.appendChild(countVal);
-  curserAndCountInfo.appendChild(countLabel);
+      var countVal = document.createElement('span');
+      countVal.className = 'jsoneditor-curserinfo-count';
+      countVal.innerText = 0;
+      countVal.style.display = 'none';
 
-  this.setSchema(this.options.schema, this.options.schemaRefs);
+      this.curserInfoElements.countLabel = countLabel;
+      this.curserInfoElements.countVal = countVal;
+
+      statusBar.appendChild(countVal);
+      statusBar.appendChild(countLabel);    
+  }
+
+  this.setSchema(this.options.schema, this.options.schemaRefs);  
 };
 
 /**
@@ -302,20 +313,19 @@ textmode._onChange = function () {
  * @private
  */
 textmode._onSelect = function () {
-  var selectionRange = {};
-    
-  if (this.textarea) {    
-    selectionRange = util.getInputSelection(this.textarea);
-  } else if (this.aceEditor) {
-    var curserPos = this.aceEditor.getCursorPosition();
-    var selectedText = this.aceEditor.getSelectedText();
-    this.curserInfoElements.lnVal.innerText = curserPos.row + 1;
-    this.curserInfoElements.colVal.innerText = curserPos.column + 1;
-    this._setSelectionCountDisplay(selectedText.length);
-  }
-
-  if (selectionRange.start !== selectionRange.end) {
-    this._setSelectionCountDisplay(Math.abs(selectionRange.end - selectionRange.start));
+  if(this.options.statusBar) {
+    if (this.textarea) {
+      var selectionRange = util.getInputSelection(this.textarea);
+      if (selectionRange.start !== selectionRange.end) {
+        this._setSelectionCountDisplay(Math.abs(selectionRange.end - selectionRange.start));
+      }
+    } else if (this.aceEditor) {
+      var curserPos = this.aceEditor.getCursorPosition();
+      var selectedText = this.aceEditor.getSelectedText();
+      this.curserInfoElements.lnVal.innerText = curserPos.row + 1;
+      this.curserInfoElements.colVal.innerText = curserPos.column + 1;
+      this._setSelectionCountDisplay(selectedText.length);
+    }
   }
 };
 
@@ -367,13 +377,15 @@ textmode._onBlur = function (event) {
 };
 
 textmode._setSelectionCountDisplay = function (value) {
-  if(value && this.curserInfoElements.countVal) {
-    this.curserInfoElements.countVal.innerText = value;
-    this.curserInfoElements.countVal.style.display = 'inline';
-    this.curserInfoElements.countLabel.style.display = 'inline';
-  } else {
-    this.curserInfoElements.countVal.style.display = 'none';
-    this.curserInfoElements.countLabel.style.display = 'none';
+  if (this.options.statusBar) {
+    if (value && this.curserInfoElements.countVal) {
+      this.curserInfoElements.countVal.innerText = value;
+      this.curserInfoElements.countVal.style.display = 'inline';
+      this.curserInfoElements.countLabel.style.display = 'inline';
+    } else {
+      this.curserInfoElements.countVal.style.display = 'none';
+      this.curserInfoElements.countLabel.style.display = 'none';
+    }
   }
 };
 
diff --git a/src/js/treemode.js b/src/js/treemode.js
index dd9d626..dfe3c38 100644
--- a/src/js/treemode.js
+++ b/src/js/treemode.js
@@ -115,7 +115,7 @@ treemode._setOptions = function (options) {
     schema: null,
     schemaRefs: null,
     autocomplete: null,
-    navigationBar : false
+    navigationBar : true
   };
 
   // copy all options
@@ -762,11 +762,11 @@ treemode._createFrame = function () {
 
   if(this.options.navigationBar) {
     // create second menu row for treepath
-    var menu2 = document.createElement('div');
-    menu2.className = 'jsoneditor-menu2';
-    this.frame.appendChild(menu2);
+    this.navBar = document.createElement('div');
+    this.navBar.className = 'jsoneditor-navigation-bar nav-bar-empty';
+    this.frame.appendChild(this.navBar);
 
-    this.treePath = new TreePath(menu2);
+    this.treePath = new TreePath(this.navBar);
     this.treePath.onSectionSelected(this._onTreePathSectionSelected.bind(this));
     this.treePath.onContextMenuItemSelected(this._onTreePathMenuItemSelected.bind(this));
   }
@@ -874,6 +874,8 @@ treemode._onEvent = function (event) {
  */
 treemode._updateTreePath = function (pathNodes) {
   if (pathNodes && pathNodes.length) {
+    util.removeClassName(this.navBar, 'nav-bar-empty');
+    
     var pathObjs = [];
     pathNodes.forEach(function (node) {
       var pathObj = {
@@ -892,6 +894,8 @@ treemode._updateTreePath = function (pathNodes) {
       pathObjs.push(pathObj);
     });
     this.treePath.setPath(pathObjs);
+  } else {
+    util.addClassName(this.navBar, 'nav-bar-empty');
   }
 
   function getName(node) {
@@ -1242,6 +1246,9 @@ treemode._onKeyDown = function (event) {
 treemode._createTable = function () {
   var contentOuter = document.createElement('div');
   contentOuter.className = 'jsoneditor-outer';
+  if(this.options.navigationBar) {
+    util.addClassName(contentOuter, 'has-nav-bar');
+  }
   this.contentOuter = contentOuter;
 
   this.content = document.createElement('div');
diff --git a/test/test_navigationBar.html b/test/test_navigationBar.html
deleted file mode 100644
index 597bdc9..0000000
--- a/test/test_navigationBar.html
+++ /dev/null
@@ -1,79 +0,0 @@
-<!DOCTYPE HTML>
-<html>
-<head>
-  <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
-
-  <link href="../dist/jsoneditor.css" rel="stylesheet" type="text/css">
-  <script src="../dist/jsoneditor.js"></script>
-
-  <style type="text/css">
-    body {
-      font: 10.5pt arial;
-      color: #4d4d4d;
-      line-height: 150%;
-      width: 500px;
-      padding-left: 40px;
-    }
-
-    code {
-      background-color: #f5f5f5;
-    }
-
-    #jsoneditor {
-      width: 500px;
-      height: 500px;
-    }
-  </style>
-</head>
-<body>
-
-<p>
-  Switch editor mode using the mode box.
-  Note that the mode can be changed programmatically as well using the method
-  <code>editor.setMode(mode)</code>, try it in the console of your browser.
-</p>
-
-<form>
-  <div id="jsoneditor"></div>
-</form>
-
-<script>
-  var container, options, json, editor;
-
-  container = document.getElementById('jsoneditor');
-
-  options = {
-    mode: 'tree',
-    modes: ['code', 'form', 'text', 'tree', 'view'], // allowed modes
-    onError: function (err) {
-      alert(err.toString());
-    },
-    onChange: function () {
-      console.log('change');
-    },
-    indentation: 4,
-    escapeUnicode: true,
-    navigationBar: true
-  };
-
-  json = {
-    "array": [1, 2, [3,4,5]],
-    "boolean": true,
-    "htmlcode": '&quot;',
-    "escaped_unicode": '\\u20b9',
-    "unicode": '\u20b9,\uD83D\uDCA9',
-    "return": '\n',
-    "null": null,
-    "number": 123,
-    "object": {"a": "b", "c": "d"},
-    "string": "Hello World",
-    "url": "http://jsoneditoronline.org"
-  };
-
-  editor = new JSONEditor(container, options, json);
-
-  console.log('json', json);
-  console.log('string', JSON.stringify(json));
-</script>
-</body>
-</html>