diff --git a/browser/main/Detail/MarkdownNoteDetail.js b/browser/main/Detail/MarkdownNoteDetail.js
index 9eac8d1f..6f16e9d0 100644
--- a/browser/main/Detail/MarkdownNoteDetail.js
+++ b/browser/main/Detail/MarkdownNoteDetail.js
@@ -31,13 +31,9 @@ class MarkdownNoteDetail extends React.Component {
       }, props.note),
       isLockButtonShown: false,
       isLocked: false,
-      fullScreen: {
-        status: false,
-        oldState: {
-          nd : 0,
-          mb : 0
-        }
-      }
+      fullScreen: false,
+      widthOfNoteDetail: 0,
+      widthOfMainBody: 0
     }
     this.dispatchTimer = null
 
@@ -204,31 +200,27 @@ class MarkdownNoteDetail extends React.Component {
   }
 
   handleFullScreenButton (e) {
+    const currentScreenState = !Object.assign({}, this.state).fullScreen
+    this.setState({ fullScreen: currentScreenState })
 
-    this.state.fullScreen.status = !this.state.fullScreen.status
-    const noteDetail = document.querySelector(".NoteDetail")
-    const mainBody = document.querySelector(".Main__body___browser-main-")
-    const sliderRight = document.querySelector(".Main__slider-right___browser-main-")
-    const slider = document.querySelector(".Main__slider___browser-main-")
+    const noteDetail = document.querySelector('.NoteDetail')
+    const mainBody = document.querySelector('#main-body')
+    const sliderRight = document.querySelector('#slider-right')
+    const sliderLeft = document.querySelector('#slider-left')
 
-    if(this.state.fullScreen.status) {
-
-      this.state.fullScreen.oldState.nd = noteDetail.style.left
-      this.state.fullScreen.oldState.mb = mainBody.style.left
-      noteDetail.style.left = "0px"
-      mainBody.style.left = "0px"
+    if (currentScreenState) {
+      this.state.widthOfNoteDetail = noteDetail.style.left
+      this.state.widthOfMainBody = mainBody.style.left
+      noteDetail.style.left = '0px'
+      mainBody.style.left = '0px'
       sliderRight.style.display = 'none'
-      slider.style.display = 'none'
-
-    }else {
-
-      noteDetail.style.left = this.state.fullScreen.oldState.nd
-      mainBody.style.left = this.state.fullScreen.oldState.mb
+      sliderLeft.style.display = 'none'
+    } else {
+      noteDetail.style.left = this.state.widthOfNoteDetail
+      mainBody.style.left = this.state.widthOfMainBody
       sliderRight.style.display = 'block'
-      slider.style.display = 'block'
-
+      sliderLeft.style.display = 'block'
     }
-
   }
 
   handleLockButtonMouseDown (e) {
diff --git a/browser/main/Detail/SnippetNoteDetail.js b/browser/main/Detail/SnippetNoteDetail.js
index 0d836c1a..4c288b17 100644
--- a/browser/main/Detail/SnippetNoteDetail.js
+++ b/browser/main/Detail/SnippetNoteDetail.js
@@ -49,13 +49,9 @@ class SnippetNoteDetail extends React.Component {
       }, props.note, {
         snippets: props.note.snippets.map((snippet) => Object.assign({}, snippet))
       }),
-      fullScreen: {
-        status: false,
-        oldState: {
-          nd : 0,
-          mb : 0
-        }
-      }
+      fullScreen: false,
+      widthOfNoteDetail: 0,
+      widthOfMainBody: 0
 
     }
   }
@@ -199,31 +195,27 @@ class SnippetNoteDetail extends React.Component {
   }
 
   handleFullScreenButton (e) {
+    const currentScreenState = !Object.assign({}, this.state).fullScreen
+    this.setState({ fullScreen: currentScreenState })
 
-    this.state.fullScreen.status = !this.state.fullScreen.status
-    const noteDetail = document.querySelector(".NoteDetail")
-    const mainBody = document.querySelector(".Main__body___browser-main-")
-    const sliderRight = document.querySelector(".Main__slider-right___browser-main-")
-    const slider = document.querySelector(".Main__slider___browser-main-")
+    const noteDetail = document.querySelector('.NoteDetail')
+    const mainBody = document.querySelector('#main-body')
+    const sliderRight = document.querySelector('#slider-right')
+    const sliderLeft = document.querySelector('#slider-left')
 
-    if(this.state.fullScreen.status) {
-
-      this.state.fullScreen.oldState.nd = noteDetail.style.left
-      this.state.fullScreen.oldState.mb = mainBody.style.left
-      noteDetail.style.left = "0px"
-      mainBody.style.left = "0px"
+    if (currentScreenState) {
+      this.state.widthOfNoteDetail = noteDetail.style.left
+      this.state.widthOfMainBody = mainBody.style.left
+      noteDetail.style.left = '0px'
+      mainBody.style.left = '0px'
       sliderRight.style.display = 'none'
-      slider.style.display = 'none'
-
-    }else {
-
-      noteDetail.style.left = this.state.fullScreen.oldState.nd
-      mainBody.style.left = this.state.fullScreen.oldState.mb
+      sliderLeft.style.display = 'none'
+    } else {
+      noteDetail.style.left = this.state.widthOfNoteDetail
+      mainBody.style.left = this.state.widthOfMainBody
       sliderRight.style.display = 'block'
-      slider.style.display = 'block'
-
+      sliderLeft.style.display = 'block'
     }
-
   }
 
   handleTabPlusButtonClick (e) {
diff --git a/browser/main/Main.js b/browser/main/Main.js
index abada90d..9de6b8c0 100644
--- a/browser/main/Main.js
+++ b/browser/main/Main.js
@@ -168,6 +168,7 @@ class Main extends React.Component {
         />
         {!config.isSideNavFolded &&
           <div styleName={this.state.isLeftSliderFocused ? 'slider--active' : 'slider'}
+            id='slider-left'
             style={{left: this.state.navWidth}}
             onMouseDown={(e) => this.handleLeftSlideMouseDown(e)}
             draggable='false'
@@ -176,6 +177,7 @@ class Main extends React.Component {
           </div>
         }
         <div styleName={config.isSideNavFolded ? 'body--expanded' : 'body'}
+          id='main-body'
           ref='body'
           style={{left: config.isSideNavFolded ? 44 : this.state.navWidth}}
         >
@@ -198,6 +200,7 @@ class Main extends React.Component {
             ])}
           />
           <div styleName={this.state.isRightSliderFocused ? 'slider-right--active' : 'slider-right'}
+            id='slider-right'
             style={{left: this.state.listWidth - 1}}
             onMouseDown={(e) => this.handleRightSlideMouseDown(e)}
             draggable='false'